.modal-create-dashboard {
    font-size: 14px;
    padding-bottom: 20px
}

.modal-create-dashboard .note-label {
    padding-bottom: 10px;
    padding-left: 14px
}

.modal-create-dashboard ul.link-btns {
    display: flex;
    justify-content: space-between
}

.modal-create-dashboard ul.link-btns > li {
    cursor: pointer;
    border: 3px solid #fff;
    background: #efefef;
    padding: 10px 32px
}

.modal-create-dashboard ul.link-btns > li.selected {
    border: 3px solid #00c1de
}

.modal-create-dashboard ul.link-btns > li > i {
    color: #00c1de;
    margin-right: 10px
}

@font-face {
    font-family: iconfont;
    src: url("//at.alicdn.com/t/font_138257_4hg71fuoozk9be29.eot");
    src: url("//at.alicdn.com/t/font_138257_4hg71fuoozk9be29.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_138257_4hg71fuoozk9be29.woff") format("woff"), url("//at.alicdn.com/t/font_138257_4hg71fuoozk9be29.ttf") format("truetype"), url("//at.alicdn.com/t/font_138257_4hg71fuoozk9be29.svg#iconfont") format("svg")
}

[class*=" icon-"], [class^=icon-] {
    background-image: none;
    margin-right: 0;
    width: auto;
    height: auto
}

.iconfont {
    font-family: iconfont !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: .2px;
    -moz-osx-font-smoothing: grayscale
}

.iconfont-unknow:before {
    content: "?"
}

.icon-log:before {
    content: "\E6F3"
}

.icon-implement:before {
    content: "\E71C"
}

.icon-mail:before {
    content: "\E605"
}

.icon-date:before {
    content: "\E69F"
}

.icon-save:before {
    content: "\E6E2"
}

.icon-saveas:before {
    content: "\E6E3"
}

.icon-open:before {
    content: "\E6A2"
}

.icon-publish:before {
    content: "\E718"
}

.icon-table:before {
    content: "\E65F"
}

.icon-picture:before {
    content: "\E62D"
}

.icon-chart:before {
    content: "\E667"
}

.icon-cubedesigner:before {
    content: "\E6A4"
}

.icon-arraw-left:before {
    content: "\E670"
}

.icon-arraw-right:before {
    content: "\E66F"
}

.icon-right:before {
    content: "\E6A7"
}

.icon-left:before {
    content: "\E6A6"
}

.icon-top:before {
    content: "\E67E"
}

.icon-bottom:before {
    content: "\E67F"
}

.icon-fx:before {
    content: "\E6A5"
}

.icon-bold:before {
    content: "\E634"
}

.icon-italic:before {
    content: "\E638"
}

.icon-underline:before {
    content: "\E644"
}

.icon-overline:before {
    content: "\E64B"
}

.icon-border-all:before {
    content: "\E63F"
}

.icon-border-outer:before {
    content: "\E640"
}

.icon-border-none:before {
    content: "\E642"
}

.icon-border-top:before {
    content: "\E63C"
}

.icon-border-bottom:before {
    content: "\E643"
}

.icon-border-left:before {
    content: "\E652"
}

.icon-border-right:before {
    content: "\E647"
}

.icon-border-inner:before {
    content: "\E64C"
}

.icon-border-inner-h:before {
    content: "\E64A"
}

.icon-border-inner-v:before {
    content: "\E64D"
}

.icon-align-left:before {
    content: "\E653"
}

.icon-align-center:before {
    content: "\E636"
}

.icon-align-right:before {
    content: "\E648"
}

.icon-valign-top:before {
    content: "\E6AA"
}

.icon-valign-middle:before {
    content: "\E6A9"
}

.icon-valign-bottom:before {
    content: "\E6A8"
}

.icon-indent-increase:before {
    content: "\E63E"
}

.icon-indent-decrease:before {
    content: "\E639"
}

.icon-warp:before {
    content: "\E64F"
}

.icon-merge:before {
    content: "\E631"
}

.icon-insert-row:before {
    content: "\E62C"
}

.icon-insert-col:before {
    content: "\E62B"
}

.icon-remove-row:before {
    content: "\E63B"
}

.icon-remove-col:before {
    content: "\E63A"
}

.icon-fit-row:before {
    content: "\E651"
}

.icon-fit-col:before {
    content: "\E650"
}

.icon-hide-row:before {
    content: "\E6AC"
}

.icon-hide-col:before {
    content: "\E6AB"
}

.icon-fix-row:before {
    content: "\E6BB"
}

.icon-fix-col:before {
    content: "\E6BA"
}

.icon-fix-none:before {
    content: "\E6BC"
}

.icon-format-persent:before {
    content: "\E6AD"
}

.icon-format-separator:before {
    content: "\E6AE"
}

.icon-format-decimal-increase:before {
    content: "\E6B0"
}

.icon-format-decimal-decrease:before {
    content: "\E6AF"
}

.icon-remove:before {
    content: "\E613"
}

.icon-error:before {
    content: "\E6FC"
}

.icon-success:before {
    content: "\E6FA"
}

.icon-question:before {
    content: "\E6FD"
}

.icon-info:before {
    content: "\E6FE"
}

.icon-warning:before {
    content: "\E6FB"
}

.icon-arraw-up:before {
    content: "\E6EC"
}

.icon-arraw-level:before {
    content: "\E619"
}

.icon-arraw-down:before {
    content: "\E6ED"
}

.icon-more:before {
    content: "\E697"
}

.icon-line:before {
    content: "\E66C"
}

.icon-bar:before {
    content: "\E667"
}

.icon-area:before {
    content: "\E672"
}

.icon-arrow-r:before {
    content: "\E6B5"
}

.icon-dblarrow-r:before {
    content: "\E6B8"
}

.icon-arrow-l:before {
    content: "\E6B6"
}

.icon-dblarrow-l:before {
    content: "\E6B9"
}

.icon-dblarrow-d:before {
    content: "\E73D"
}

.icon-dblarrow-u:before {
    content: "\E73D";
    transform: rotate(180deg);
    display: inline-block;
    line-height: 1rem
}

.icon-arrow-u:before {
    content: "\E680"
}

.icon-arrow-d:before {
    content: "\E681"
}

.icon-download:before {
    content: "\E6BD"
}

.icon-sort:before {
    content: "\E6C2"
}

.icon-add:before {
    content: "\E696"
}

.icon-permit:before {
    content: ""
}

.icon-edit:before {
    content: "\E686"
}

.icon-preview:before {
    content: "\E691"
}

.icon-exitpreview:before {
    content: "\E646"
}

.icon-fullscreen:before {
    content: "\E66D"
}

.icon-back:before {
    content: "\E6D0"
}

.icon-fresh:before {
    content: "\E6B1"
}

.icon-join-inner:before {
    content: "\E6E0"
}

.icon-join-left:before {
    content: "\E6E9"
}

.icon-search:before {
    content: "\E614"
}

.icon-movable:before {
    content: "\E789"
}

.icon-true:before {
    content: "\E6D2"
}

.icon-delete:before {
    content: "\E61D"
}

.icon-new:before {
    content: "\E6D7"
}

.icon-hierarchy:before {
    content: "\E748"
}

.icon-out:before {
    content: "\E6D5"
}

.icon-change-v:before {
    content: "\E6EF"
}

.icon-change-h:before {
    content: "\E6D3"
}

.icon-loading:before {
    content: "\E603"
}

.icon-sum:before {
    content: "\E810"
}

.icon-close-x:before {
    content: "\E71E"
}

.icon-folder-close:before {
    content: "\E6F1"
}

.icon-close:before {
    content: "\E6DC"
}

.icon-open:before {
    content: "\E6DD"
}

.icon-database-reset:before {
    content: "\E6E7"
}

.icon-table:before {
    content: "\E6D9"
}

.icon-string:before {
    content: "\E809"
}

.icon-datetime:before {
    content: "\E807"
}

.icon-number:before {
    content: "\E796"
}

.icon-location:before {
    content: "\E6D8"
}

.icon-calc:before {
    content: "\E6E1"
}

.icon-config:before {
    content: "\E6BE"
}

.icon-msg:before {
    content: "\E725"
}

.icon-msg-mobile:before {
    content: "\E73B"
}

.icon-common-head-help:before {
    content: "\E72B"
}

.icon-common-head-help-doc:before {
    content: "\E72D"
}

.icon-common-head-help-video:before {
    content: "\E72E"
}

.icon-common-head-help-forum:before {
    content: "\E72C"
}

.icon-dim:before {
    content: "\E6E5"
}

.icon-measure:before {
    content: "\E6E6"
}

.icon-copy:before {
    content: "\E62F"
}

.icon-formatnumber:before {
    content: "\E6EE"
}

.icon-dashboard:before {
    content: "\E6DE"
}

.icon-worksheet-mobile:before {
    content: "\E740"
}

.icon-dashboard-mobile:before {
    content: "\E73C"
}

.icon-dashboard-classic:before {
    content: "\E730"
}

.icon-worksheet:before {
    content: "\E792"
}

.icon-worksheet-classic:before {
    content: "\E72F"
}

.icon-help:before {
    content: "\E6FD"
}

.icon-person:before {
    content: "\E6F8"
}

.icon-mark:before {
    content: "\E7AF"
}

.icon-down:before {
    content: "\E681"
}

.icon-up:before {
    content: "\E680"
}

.icon-optimise:before {
    content: "\E6F2"
}

.icon-group:before {
    content: "\E6F7"
}

.icon-admin:before {
    content: "\E6F6"
}

.icon-user:before {
    content: "\E690"
}

.icon-home:before {
    content: "\E738"
}

.icon--mobile:before {
    content: "\E73B"
}

.icon-my-mobile:before {
    content: "\E73A"
}

.iconfont.invalid {
    color: #dcdcdc
}

.iconfont.valid {
    color: #00c1de
}

.icon-newtag:before {
    content: "\E60B"
}

.icon-ellipsis:before {
    content: "\E6A0"
}

.icon-list:before {
    content: "\E694"
}

.icon-filter:before {
    content: "\E67D"
}

.icon-sort-up:before {
    content: "\E60E"
}

.icon-sort-down:before {
    content: "\E6B4"
}

.icon-sort-none:before {
    content: "\E6B3"
}

.icon-share:before {
    content: "\E600"
}

.icon-classic:before {
    content: "\E601"
}

.icon-select:before {
    content: "\E6A1"
}

.icon-delete2:before {
    content: "\E610"
}

.icon-add2:before {
    content: "\E60F"
}

.icon-intro:before {
    content: "\E6D1"
}

.icon-cancellink:before {
    content: "\E716"
}

.icon-clickme:before {
    content: "\E6FF"
}

.icon-rise:before {
    content: "\E617"
}

.icon-reduce:before {
    content: "\E618"
}

.icon-normal:before {
    content: "\E701"
}

.icon-circle:before {
    content: "\E700"
}

.icon-countd:before, .icon-distinct-count:before {
    content: "\E708"
}

.icon-count:before {
    content: "\E707"
}

.icon-sum:before {
    content: "\E706"
}

.icon-avg:before {
    content: "\E704"
}

.icon-max:before {
    content: "\E705"
}

.icon-min:before {
    content: "\E703"
}

.icon-null:before {
    content: "\E70A"
}

.icon-empty:before {
    content: ""
}

.icon-data:before {
    content: "\E7C1"
}

.icon-view:before {
    content: "\E70B"
}

.icon-setup:before {
    content: "\E70C"
}

.icon-guage:before {
    content: "\E6F5"
}

.icon-datasource:before {
    content: "\E625"
}

.icon-change-hv:before {
    content: "\E6D4"
}

.icon-SQLshujuji:before {
    content: "\E71B"
}

.icon-cube:before {
    content: "\E722"
}

.icon-rename:before {
    content: "\E71D"
}

.icon-dashboard:before {
    content: "\E720"
}

.icon-worksheet:before {
    content: "\E71F"
}

.icon-move:before {
    content: "\E728"
}

.icon-share:before {
    content: "\E729"
}

.icon-row-permission:before {
    content: "\E621"
}

.icon-edit:before {
    content: "\E61B"
}

.icon-suodingshujuji:before {
    content: "\E724"
}

.icon-tuceng:before {
    content: "\E70D"
}

.icon-folder:before {
    content: "\E6F1"
}

.icon-folder-open:before {
    content: "\E6F0"
}

.icon-transfer:before {
    content: "\E6D5"
}

.icon-move-to:before {
    content: "\E728"
}

.icon-more-operation:before {
    content: "\E723"
}

.icon-double-arrow-down:before {
    content: "\E812"
}

.icon-double-arrow-up:before {
    content: "\E811"
}

.icon-dashboard-mode-normal:before {
    content: "\E736"
}

.icon-dashboard-mode-fullscreen:before {
    content: "\E737"
}

.icon-clear:before {
    content: "\E73E"
}

.icon-manual-input:before {
    content: "\E73F"
}

.fast-create-bar {
    font-family: MicrosoftYaHei;
    color: #2b2d47;
    position: fixed;
    height: 50px;
    line-height: 50px;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
    background: #fff;
    box-shadow: 0 2px 6px 0 rgba(130, 150, 183, .72);
    transform: translateY(50px);
    transition: all .2s ease-in
}

.fast-create-bar.active {
    transform: translateY(0)
}

.fast-create-bar .active-bar {
    position: absolute;
    width: 35px;
    height: 35px;
    top: -34px;
    line-height: 38px;
    border-radius: 20px 20px 0 0;
    background: #fff;
    text-align: center;
    font-size: 16px;
    left: 62px;
    box-shadow: 0 -1px 3px -1px rgba(130, 150, 183, .72)
}

.fast-create-bar .bar-title {
    float: left;
    padding: 0 20px;
    border-right: 1px solid #f0f2f5
}

.fast-create-bar .operation-list {
    float: left;
    list-style: none;
    margin: 0
}

.fast-create-bar .operation-list > li {
    float: left;
    padding: 0 20px;
    border-right: 1px solid #f0f2f5;
    cursor: pointer
}

.fast-create-bar .operation-list > li:hover {
    background: #17b4d6;
    color: #fff
}

.fast-create-bar .bar-get-data {
    float: right;
    padding: 0 20px;
    border-left: 1px solid #f0f2f5;
    cursor: pointer
}

.fast-create-bar .bar-get-data:hover {
    background: #17b4d6;
    color: #fff
}

.ztree * {
    font-size: 12px
}

.ztree, .ztree * {
    padding: 0;
    margin: 0;
    color: #333
}

.ztree li {
    padding: 0;
    /*margin: 4px 0;*/
    list-style: none;
    text-align: left;
    white-space: normal;
    outline: 0
}

.ztree li ul {
    margin: 0;
    padding: 0 5px;
}

.ztree li a {
    padding-right: 3px;
    margin: 0;
    cursor: pointer;
    color: #fff;
    background-color: transparent;
    text-decoration: none;
    vertical-align: top;
    display: inline-block;
    height: 26px;
    line-height: 26px;
    width: calc(100% - 30px)
}

.ztree li a input.rename {
    height: 14px;
    width: 80px;
    padding: 0;
    margin: 0;
    color: #af0000;
    background-color: #fff;
    font-size: 12px;
    border: 1px solid #585956;
    *border: 0
}

.ztree .node_name {
    padding: 0 4px;
    margin-left: 5px;
    height: 24px;
    line-height: 24px;
    width: calc(100% - 80px);
    min-width: 50px;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
    color: #333;
    display: inline-block;
    position: relative
}

.ztree .node_name, .ztree li a {
    border: 1px solid transparent
}

.ztree li a.curSelectedNode .node_name, .ztree li a:hover .node_name {
    border-radius: 12px
}

.ztree li a.curSelectedNode .node_name:after, .ztree li a:hover .node_name:after {
    font-family: iconfont;
    content: "\E6BE";
    color: #666;
    font-size: 12px;
    position: absolute;
    right: 4px
}

.ztree li a.curSelectedNode_Edit {
    padding-top: 0;
    background-color: transparent;
    color: #ff0;
    height: 17px;
    border: 1px solid #666;
    opacity: .8
}

.ztree li a.tmpTargetNode_inner {
    padding-top: 0;
    height: 20px;
    border: 1px solid #999;
    opacity: .8;
    background: #f2f2f2;
    filter: alpha(opacity=80);
    border-radius: 4px
}

.data-div {
    width: calc(100% - 502px);
    max-width: 836px;
    max-height: 90%;
    overflow: auto;
}

.no-cube .data-div {
    width: calc(100% - 322px);
}

.no-widget .data-div {
    width: calc(100% - 222px);
}

.no-cube.no-widget .data-div {
    width: calc(100% - 22px);
}

.data-table {
}

.data-table td {
    max-width: 100px;
    min-height: 20px;
    text-overflow: ellipsis;
    overflow: hidden !important;
}

.data-table th {
    max-width: 100px;
    min-height: 20px;
    text-overflow: ellipsis;
    overflow: hidden !important;
}

.column-list {
    width: 299px;
    min-height: 50px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #f8f8f8;
}

.column-list .column-measure {
    background: #ddeed5;
    border: 1px solid #64bd4f;
}

.column-list .column-item {
    margin: 4px 5px;
    text-align: left;
    padding: 0 10px;
    background: #def1f6;
    border: 1px solid #00c1de;
    border-radius: 4px;
    height: 26px;
    line-height: 24px;
}

.column-list .column-measure span.button {
    color: #64bd4f;
}

.column-list .column-item span.button {
    color: #56c8e2;
    position: absolute;
    left: 8px;
}

.column-list .column-item .icon-aggregate {
    position: absolute;
    left: 30px;
    color: #6f6f6f;
}

.column-list .column-item .data-item {
    display: inline-block;
    width: calc(100% - 60px);
    overflow: hidden;
    text-overflow: ellipsis;
    height: 24px;
    margin-left: 34px;
    white-space: nowrap;
}

.column-list .column-item .icon-remove {
    font-size: 12px;
    cursor: pointer;
}

.panel-container {
    height: 50% !important;
    background: #fff;
}

.filter-field-node {
    left: 15px;
    width: calc(100% - 40px) !important;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: inline-block;
    position: relative;
}

.ztree li span {
    line-height: 17px;
    margin-right: 2px;
    background-color: transparent
}

.ztree li span.button {
    line-height: 0;
    margin: 0 2px;
    padding: 0;
    width: 15px;
    height: 17px;
    display: inline-block;
    vertical-align: top;
    border: 0 solid;
    cursor: pointer;
    outline: none;
    background-color: transparent;
    background-repeat: no-repeat;
    background-attachment: scroll
}

.ztree li span.button:hover {
    background: none !important
}

.ztree li span.none_ico_close, .ztree li span.none_ico_docu, .ztree li span.none_ico_open {
    width: 2px
}

.ztree li span.button:before {
    color: #999;
    font-family: iconfont;
    padding-top: 12px;
    font-size: 20px;
    -webkit-font-smoothing: antialiased
}

.ztree li span {
    line-height: 24px;
    margin-right: 2px;
    background-color: transparent
}

.ztree li span.fbutton {
    line-height: 0;
    margin: 3px 3px;
    padding: 4px 0 0 3px;
    width: 15px;
    height: 17px;
    display: inline-block;
    vertical-align: top;
    border: 0 solid;
    cursor: pointer;
    outline: none;
    background-color: transparent;
    background-repeat: no-repeat;
    background-attachment: scroll
}

.ztree li span.fbutton:hover {
    background: none !important
}

.ztree li span.fbutton:before {
    color: #999;
    font-family: iconfont;
    padding-top: 10px;
    font-size: 20px;
    -webkit-font-smoothing: antialiased
}

.ztree li span.button.chk {
    margin: 0;
    cursor: auto;
    width: 12px;
    display: inline-block;
    padding-top: 10px;
    padding-left: 2px
}

.ztree li span.button.chk.checkbox_false_full:before {
    content: "\F096"
}

.ztree li span.button.chk.checkbox_false_full_focus:before {
    content: "\F096";
    color: #ff0
}

.ztree li span.button.chk.checkbox_false_part:before {
    content: "\F096";
    color: #aaa
}

.ztree li span.button.chk.checkbox_false_part_focus:before {
    content: "\F096";
    color: #cad96c
}

.ztree li span.button.chk.checkbox_false_disable:before {
    content: "\F096";
    color: gray
}

.ztree li span.button.chk.checkbox_true_full:before {
    content: "\F046"
}

.ztree li span.button.chk.checkbox_true_part:before {
    content: "\F14A"
}

.ztree li span.button.chk.checkbox_true_part_focus:before {
    content: "\F14A";
    color: #ff0
}

.ztree li span.button.chk.checkbox_true_full_focus:before {
    content: "\F046";
    color: #ff0
}

.ztree li span.button.chk.checkbox_true_part:before {
    content: "\F046";
    color: #aaa
}

.ztree li span.button.chk.checkbox_true_part_focus:before {
    content: "\F046";
    color: #cad96c
}

.ztree li span.button.chk.checkbox_true_disable:before {
    content: "\F046";
    color: gray
}

.ztree li span.button.chk.radio_false_full:before {
    content: "\F10C"
}

.ztree li span.button.chk.radio_false_full_focus:before {
    content: "\F10C";
    color: #ff0
}

.ztree li span.button.chk.radio_false_part:before {
    content: "\F10C";
    color: #aaa
}

.ztree li span.button.chk.radio_false_part_focus:before {
    content: "\F10C";
    color: #ff0
}

.ztree li span.button.chk.radio_false_disable:before {
    content: "\F1DB";
    color: gray
}

.ztree li span.button.chk.radio_true_full:before {
    content: "\F192"
}

.ztree li span.button.chk.radio_true_full_focus:before {
    content: "\F192";
    color: #ff0
}

.ztree li span.button.chk.radio_true_part:before, .ztree li span.button.chk.radio_true_part_focus:before {
    content: "\F192";
    color: #aaa
}

.ztree li span.button.chk.radio_true_disable:before {
    content: "\F1DB";
    color: gray
}

.ztree li span.button.switch {
    width: 15px;
    height: 17px
}

.ztree li span.button.root_open:before {
    content: "\E681";
    padding-top: 10px;
    padding-left: 2px;
    display: inline-block;
    color: #999;
    font-size: 16px
}

.ztree li span.button.root_close:before {
    content: "\E680";
    padding-top: 10px;
    padding-left: 1px;
    display: inline-block;
    color: #999;
    font-size: 18px
}

.ztree li span.button.roots_open:before {
    content: "\E681";
    padding-top: 10px;
    padding-left: 2px;
    display: inline-block;
    color: #999;
    font-size: 16px
}

.ztree li span.button.roots_close:before {
    content: "\E680";
    padding-top: 10px;
    padding-left: 1px;
    display: inline-block;
    color: #999;
    font-size: 18px
}

.ztree li span.button.center_open:before {
    content: "\E681";
    padding-top: 10px;
    padding-left: 2px;
    display: inline-block;
    color: #999;
    font-size: 16px
}

.ztree li span.button.center_close:before {
    content: "\E680";
    padding-top: 10px;
    padding-left: 1px;
    display: inline-block;
    color: #999;
    font-size: 18px
}

.ztree li span.button.bottom_open:before {
    content: "\E681";
    padding-top: 10px;
    padding-left: 2px;
    display: inline-block;
    color: #999;
    font-size: 16px
}

.ztree li span.button.bottom_close:before {
    content: "\E680";
    padding-top: 8px;
    padding-left: 1px;
    display: inline-block;
    color: #999;
    font-size: 18px
}

.ztree li span.button.root_docu {
    background: none
}

.ztree li span.button.roots_docu:before {
    padding-left: 2px;
    display: inline-block;
    color: #fff
}

.ztree li span.button.bottom_docu:before, .ztree li span.button.center_docu:before {
    padding-top: 10px;
    padding-left: 2px;
    display: inline-block;
    color: #fff
}

.ztree li span.button.noline_docu {
    background: none
}

.ztree li span.button.datetime_ico_close:before, .ztree li span.button.datetime_ico_open:before, .ztree li span.button.group_ico_close:before, .ztree li span.button.group_ico_open:before, .ztree li span.button.ico_open:before, .ztree li span.button.inner_join_ico_close:before, .ztree li span.button.inner_join_ico_open:before, .ztree li span.button.left_outer_join_ico_close:before, .ztree li span.button.left_outer_join_ico_open:before {
    content: "\E6F0";
    font-family: iconfont;
    /*padding-top: 8px;*/
    padding-left: 2px;
    display: inline-block;
    font-size: 16px
}

.ztree li span.button.group_ico_close:before, .ztree li span.button.group_ico_open:before {
    content: "\E748";
    font-size: 16px
}

.ztree li span.button.inner_join_ico_close:before, .ztree li span.button.inner_join_ico_open:before {
    content: "\E6E0";
    font-size: 14px
}

.ztree li span.button.left_outer_join_ico_close:before, .ztree li span.button.left_outer_join_ico_open:before {
    content: "\E6E9";
    font-size: 14px
}

.ztree li span.button.datetime_ico_close:before, .ztree li span.button.datetime_ico_open:before {
    content: "\E807";
    font-size: 16px
}

.ztree li span.button.ico_close:before {
    content: "\E6F1";
    font-family: iconfont;
    padding-top: 8px;
    padding-left: 2px;
    display: inline-block;
    font-size: 16px
}

.ztree li span.button._ico_docu:before, .ztree li span.button.calc_ico_docu:before, .ztree li span.button.datetime_ico_docu:before, .ztree li span.button.DATETIME_ico_docu:before, .ztree li span.button.ico_docu:before, .ztree li span.button.location_ico_docu:before, .ztree li span.button.LOCATION_ico_docu:before, .ztree li span.button.number_ico_docu:before, .ztree li span.button.NUMBER_ico_docu:before, .ztree li span.button.string_ico_docu:before, .ztree li span.button.STRING_ico_docu:before {
    font-family: iconfont;
    padding-top: 13px;
    padding-left: 2px;
    display: inline-block;
    font-size: 16px;
    content: "?"
}

.ztree li span.button.dot_ico_docu {
    line-height: 10px;
    text-align: right
}

.ztree li span.button.dot_ico_docu:before {
    content: "."
}

.ztree li span.button.string_ico_docu:before, .ztree li span.button.STRING_ico_docu:before {
    content: "\E809"
}

.ztree li span.button.number_ico_docu:before, .ztree li span.button.NUMBER_ico_docu:before {
    content: "\E796"
}

.ztree li span.button.location_ico_docu:before, .ztree li span.button.LOCATION_ico_docu:before {
    content: "\E6D8"
}

.ztree li span.button.text_ico_docu:before, .ztree li span.button.TEXT_ico_docu:before {
    content: "\E71E";
    font-size: 13px;
    margin-left: 2px
}

.ztree li span.button.datetime_ico_docu:before, .ztree li span.button.DATETIME_ico_docu:before {
    content: "\E807"
}

.ztree li span.button.calc_ico_docu:before {
    content: "\E6CE";
    font-size: 13px;
    margin-left: 2px
}

.ztree li span.button.edit {
    margin-left: 4px;
    margin-right: -1px;
    vertical-align: top;
    *vertical-align: middle;
    padding-top: 10px
}

.ztree li span.button.edit:before {
    content: "\F044";
    display: none
}

.ztree li span.button.remove {
    margin-left: 4px;
    margin-right: -1px;
    vertical-align: top;
    *vertical-align: middle;
    padding-top: 10px
}

.ztree li span.button.remove:before {
    content: "\F1F8";
    display: none
}

.ztree li span.button.add {
    margin-left: 4px;
    margin-right: -1px;
    vertical-align: top;
    *vertical-align: middle;
    padding-top: 10px
}

.ztree li span.button.add:before {
    content: "\F067";
    font-family: FontAwesome
}

.ztree li span.button.ico_loading {
    margin-right: 2px;
    background: url() no-repeat scroll 0 0 transparent;
    vertical-align: top;
    *vertical-align: middle
}

ul.tmpTargetzTree {
    background-color: #ddd
}

span.tmpzTreeMove_arrow {
    width: 16px;
    height: 17px;
    display: inline-block;
    padding: 0;
    margin: 2px 0 0 1px;
    border: none;
    position: absolute;
    z-index: 9999
}

span.tmpzTreeMove_arrow:before {
    content: "\E6A7";
    font-family: iconfont;
    color: #333
}

ul.ztree.zTreeDragUL {
    margin: 0;
    padding: 0;
    position: absolute;
    width: auto;
    min-width: 120px;
    overflow: hidden;
    height: 20px;
    border-radius: 10px;
    opacity: .8;
    filter: alpha(opacity=80);
    z-index: 9999
}

ul.ztree.zTreeDragUL li {
    margin: 0
}

.ztreeMask {
    z-index: 10000;
    background-color: #cfcfcf;
    opacity: 0;
    filter: alpha(opacity=0);
    position: absolute
}

.ng-valid.required, form .ng-valid[required] {
    border-left: 5px solid #42a948
}

.ng-invalid:not(form):focus, form .ng-invalid:not(form) {
    border: 1px solid rgba(255, 23, 23, .3);
    border-left: 1px solid rgba(255, 23, 23, .3)
}

.cube-nav {
    background: #d8d8d8;
    color: #333;
    height: 20px;
    line-height: 20px;
    padding-left: 10px;
    position: relative
}

.cube-nav label {
    transform: scale(.83333)
}

.cube-nav .icon-close {
    font-size: 10px;
    position: absolute;
    right: 6px;
    color: #5f5454;
    cursor: pointer
}

.subject-title {
    height: 25px;
    line-height: 28px;
    background: #f8f8f8;
    padding: 0 5px 0 10px;
    overflow: hidden;
    position: relative;
    width: 100%;
    font-weight: bold;
}

.tree-container {
    height: calc(100% - 27px)
}

.tree-container.platformcontainer {
    height: 100%
}

.dims-container, .measures-container {
    height: 100%;
    background: #fff
}

.dims-container .tree, .measures-container .tree {
    overflow-x: hidden;
    overflow-y: auto;
    height: calc(100% - 25px)
}

.icons {
    line-height: 25px;
    position: relative;
    padding-right: 10px;
    color: #878787
}

.nopadding {
    padding-right: 0
}

.icons .iconfont {
    font-size: 12px;
    cursor: pointer
}

.icons .iconfont.icon-movable {
    font-size: 16px;
    cursor: col-resize;
    position: absolute;
    right: -6px;
    top: 1px
}

.iconfont.v-move {
    height: 30px;
    line-height: 30px;
    cursor: row-resize;
    transform: rotate(90deg);
    display: block;
    position: absolute;
    top: 0;
    left: 48%
}

.searchdim, .searchmeasure {
    width: calc(100% - 80px) !important;
    height: 22px !important;
    line-height: 22px !important;
    background: #fff;
    z-index: 999
}

.dims-container .ztree li a.curSelectedNode .node_name:after, .dims-container .ztree li a:hover .node_name:after, .dims-container .ztree li span.button:before {
    /*color: #56c8e2;*/
    color: #00aced;
}

.dims-container .ztree li span.diy_dim:before {
    color: #0d6bec
}

.measures-container .ztree li a.curSelectedNode .node_name:after, .measures-container .ztree li a:hover .node_name:after, .measures-container .ztree li span.button:before {
    color: #64bd4f
}

.measures-container .ztree li span.diy_measure:before {
    color: #0a6743
}

.dims-container .ztree li a.curSelectedNode {
    background: #def1f6;
    border: 1px solid #00c1de;
    border-radius: 4px;
    margin: 2px 5px;
}

ul.dim_tree.zTreeDragUL {
    background: #def1f6;
    border: 1px solid #00c1de
}

.measures-container .ztree li a.curSelectedNode, .measures-container .ztree li a:hover {
    background: #ddeed5;
    border: 1px solid #64bd4f;
    border-radius: 10px
}

ul.measure_tree.zTreeDragUL {
    background: #ddeed5;
    border: 1px solid #64bd4f
}

textarea {
    resize: none
}

.close-panel {
    width: 20px;
    background: #d8d8d8;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, .3);
    height: 100%;
    text-align: center;
    padding-top: 4px
}

.close-panel label {
    transform: scale(.83333)
}

.close-panel .iconfont {
    margin-bottom: 4px;
    display: block
}

.close-panel .iconfont.icon-open {
    cursor: pointer
}

.dmtag {
    margin-top: 20px
}

.normal-panel {
    height: 100%
}

.viewPanel .ztree li a.curSelectedNode .node_name:after, .viewPanel .ztree li a:hover .node_name:after {
    content: ""
}

.CodeMirror {
    font-family: monospace;
    height: 300px;
    color: #000
}

.CodeMirror-lines {
    padding: 4px 0
}

.CodeMirror pre {
    padding: 0 4px
}

.CodeMirror-gutter-filler, .CodeMirror-scrollbar-filler {
    background-color: #fff
}

.CodeMirror-gutters {
    border-right: 1px solid #ddd;
    background-color: #f7f7f7;
    white-space: nowrap
}

.CodeMirror-linenumber {
    padding: 0 3px 0 5px;
    min-width: 20px;
    text-align: right;
    color: #999;
    white-space: nowrap
}

.CodeMirror-guttermarker {
    color: #000
}

.CodeMirror-guttermarker-subtle {
    color: #999
}

.CodeMirror-cursor {
    border-left: 1px solid #000;
    border-right: none;
    width: 0
}

.CodeMirror div.CodeMirror-secondarycursor {
    border-left: 1px solid silver
}

.cm-fat-cursor .CodeMirror-cursor {
    width: auto;
    border: 0 !important;
    background: #7e7
}

.cm-fat-cursor div.CodeMirror-cursors {
    z-index: 1
}

.cm-animate-fat-cursor {
    width: auto;
    border: 0;
    -webkit-animation: blink 1.06s steps(1) infinite;
    -moz-animation: blink 1.06s steps(1) infinite;
    animation: blink 1.06s steps(1) infinite;
    background-color: #7e7
}

@-moz-keyframes blink {
    50% {
        background-color: transparent
    }
}

@-webkit-keyframes blink {
    50% {
        background-color: transparent
    }
}

@keyframes blink {
    50% {
        background-color: transparent
    }
}

.cm-tab {
    display: inline-block;
    text-decoration: inherit
}

.CodeMirror-rulers {
    position: absolute;
    left: 0;
    right: 0;
    top: -50px;
    bottom: -20px;
    overflow: hidden
}

.CodeMirror-ruler {
    border-left: 1px solid #ccc;
    top: 0;
    bottom: 0;
    position: absolute
}

.cm-s-default .cm-header {
    color: blue
}

.cm-s-default .cm-quote {
    color: #090
}

.cm-negative {
    color: #d44
}

.cm-positive {
    color: #292
}

.cm-header, .cm-strong {
    font-weight: 700
}

.cm-em {
    font-style: italic
}

.cm-link {
    text-decoration: underline
}

.cm-strikethrough {
    text-decoration: line-through
}

.cm-s-default .cm-keyword {
    color: #708
}

.cm-s-default .cm-atom {
    color: #219
}

.cm-s-default .cm-number {
    color: #164
}

.cm-s-default .cm-def {
    color: #00f
}

.cm-s-default .cm-variable-2 {
    color: #05a
}

.cm-s-default .cm-variable-3 {
    color: #085
}

.cm-s-default .cm-comment {
    color: #a50
}

.cm-s-default .cm-string {
    color: #a11
}

.cm-s-default .cm-string-2 {
    color: #f50
}

.cm-s-default .cm-meta, .cm-s-default .cm-qualifier {
    color: #555
}

.cm-s-default .cm-builtin {
    color: #30a
}

.cm-s-default .cm-bracket {
    color: #997
}

.cm-s-default .cm-tag {
    color: #170
}

.cm-s-default .cm-attribute {
    color: #00c
}

.cm-s-default .cm-hr {
    color: #999
}

.cm-s-default .cm-link {
    color: #00c
}

.cm-invalidchar, .cm-s-default .cm-error {
    color: red
}

.CodeMirror-composing {
    border-bottom: 2px solid
}

div.CodeMirror span.CodeMirror-matchingbracket {
    color: #0f0
}

div.CodeMirror span.CodeMirror-nonmatchingbracket {
    color: #f22
}

.CodeMirror-matchingtag {
    background: rgba(255, 150, 0, .3)
}

.CodeMirror-activeline-background {
    background: #e8f2ff
}

.CodeMirror {
    position: relative;
    overflow: hidden;
    background: #fff
}

.CodeMirror-scroll {
    overflow: scroll !important;
    margin-bottom: -30px;
    margin-right: -30px;
    padding-bottom: 30px;
    height: 100%;
    outline: none;
    position: relative
}

.CodeMirror-sizer {
    position: relative;
    border-right: 30px solid transparent
}

.CodeMirror-gutter-filler, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-vscrollbar {
    position: absolute;
    z-index: 6;
    display: none
}

.CodeMirror-vscrollbar {
    right: 0;
    top: 0;
    overflow-x: hidden;
    overflow-y: scroll
}

.CodeMirror-hscrollbar {
    bottom: 0;
    left: 0;
    overflow-y: hidden;
    overflow-x: scroll
}

.CodeMirror-scrollbar-filler {
    right: 0;
    bottom: 0
}

.CodeMirror-gutter-filler {
    left: 0;
    bottom: 0
}

.CodeMirror-gutters {
    position: absolute;
    left: 0;
    top: 0;
    min-height: 100%;
    z-index: 3
}

.CodeMirror-gutter {
    white-space: normal;
    height: 100%;
    display: inline-block;
    vertical-align: top;
    margin-bottom: -30px
}

.CodeMirror-gutter-wrapper {
    position: absolute;
    z-index: 4;
    background: none !important;
    border: none !important
}

.CodeMirror-gutter-background {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 4
}

.CodeMirror-gutter-elt {
    position: absolute;
    cursor: default;
    z-index: 4
}

.CodeMirror-gutter-wrapper {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.CodeMirror-lines {
    cursor: text;
    min-height: 1px
}

.CodeMirror pre {
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    border-width: 0;
    background: transparent;
    font-family: inherit;
    font-size: inherit;
    margin: 0;
    white-space: pre;
    word-wrap: normal;
    line-height: inherit;
    color: inherit;
    z-index: 2;
    position: relative;
    overflow: visible;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-variant-ligatures: contextual;
    font-variant-ligatures: contextual
}

.CodeMirror-wrap pre {
    word-wrap: break-word;
    white-space: pre-wrap;
    word-break: normal
}

.CodeMirror-linebackground {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0
}

.CodeMirror-linewidget {
    position: relative;
    z-index: 2;
    overflow: auto
}

.CodeMirror-code {
    outline: none
}

.CodeMirror-gutter, .CodeMirror-gutters, .CodeMirror-linenumber, .CodeMirror-scroll, .CodeMirror-sizer {
    -moz-box-sizing: content-box;
    box-sizing: content-box
}

.CodeMirror-measure {
    position: absolute;
    width: 100%;
    height: 0;
    overflow: hidden;
    visibility: hidden
}

.CodeMirror-cursor {
    position: absolute;
    pointer-events: none
}

.CodeMirror-measure pre {
    position: static
}

div.CodeMirror-cursors {
    visibility: hidden;
    position: relative;
    z-index: 3
}

.CodeMirror-focused div.CodeMirror-cursors, div.CodeMirror-dragcursors {
    visibility: visible
}

.CodeMirror-selected {
    background: #d9d9d9
}

.CodeMirror-focused .CodeMirror-selected {
    background: #d7d4f0
}

.CodeMirror-crosshair {
    cursor: crosshair
}

.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection {
    background: #d7d4f0
}

.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection {
    background: #d7d4f0
}

.cm-searching {
    background: #ffa;
    background: rgba(255, 255, 0, .4)
}

.cm-force-border {
    padding-right: .1px
}

@media print {
    .CodeMirror div.CodeMirror-cursors {
        visibility: hidden
    }
}

.cm-tab-wrap-hack:after {
    content: ""
}

span.CodeMirror-selectedtext {
    background: none
}

.CodeMirror-hints {
    position: absolute;
    z-index: 9999;
    overflow: hidden;
    list-style: none;
    margin: 0;
    padding: 2px;
    -webkit-box-shadow: 2px 3px 5px rgba(0, 0, 0, .2);
    -moz-box-shadow: 2px 3px 5px rgba(0, 0, 0, .2);
    box-shadow: 2px 3px 5px rgba(0, 0, 0, .2);
    border-radius: 3px;
    border: 1px solid silver;
    background: #fff;
    max-height: 20em;
    overflow-y: auto
}

.CodeMirror-hint {
    margin: 0;
    padding: 4px;
    border-radius: 2px;
    white-space: pre;
    color: #000;
    cursor: pointer
}

li.CodeMirror-hint-active {
    background: #00aafb;
    color: #fff
}

#calcform .CodeMirror {
    height: 100px;
    width: 384px;
    border: 1px solid #d9d9d9
}

#calcform .cm-s-default .cm-keyword {
    color: #3900ff
}

#calcform div.CodeMirror span.CodeMirror-matchingbracket {
    color: #fbb502
}

#help-column h3 {
    margin: 0
}

#help-column p {
    margin: 2px 0;
    border-bottom: 1px solid #d9d9d9;
    line-height: 24px;
    padding: 0 4px 0 20px;
    min-height: 24px;
    letter-spacing: 1px
}

#help-column p.fun-title {
    color: #00c1de;
    border-bottom: none;
    padding: 0 10px;
    line-height: 20px;
    min-height: 20px
}

#help-column p.funlist {
    line-height: 30px;
    height: 30px;
    border: none;
    padding: 0 10px
}

body .jointable select {
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    padding: 2px 20px 2px 4px;
    border: 1px solid #ddd;
    min-width: 80px;
    width: 100%;
    background: url("") 100% no-repeat
}

body .view-bar {
    background: #fff;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, .3);
    height: 40px;
    line-height: 40px;
    overflow: hidden;
    position: relative
}

body .view-bar .nav {
    text-align: center
}

body .view-bar .nav span {
    margin: 0 10px 0 0;
    color: #ababab
}

body .view-bar .nav span.iconfont {
    font-size: 12px
}

body .view-bar .nav span.iconfont.icon-edit {
    font-size: 16px;
    color: #999;
    cursor: pointer
}

body .nav .cube-name-input {
    width: 300px;
    border: none;
    border-radius: 0;
    background: none;
    margin: 0 auto;
    transition: width .1s;
    transition-timing-function: ease-in
}

body .nav .cube-name-input.ng-invalid:not(form), body .nav .cube-name-input.ng-invalid:not(form):focus {
    border: 1px solid rgba(255, 23, 23, .3);
    border-left: 1px solid rgba(255, 23, 23, .3)
}

body .view-bar .tabcontainer .btn-group {
    float: left
}

body .view-bar .tabcontainer .btn-group > .btn {
    height: 25px;
    padding: 0 4px !important;
    color: #c6c8c9;
    background: #f8f8f8;
    opacity: .8
}

body .view-bar .tabcontainer .btn-group > .btn .iconfont {
    font-size: 16px
}

body .view-bar .tabcontainer .btn-group > .btn-analysis.active {
    background: #e5f8fb;
    border-color: #00c1de
}

body .view-bar .tabcontainer .btn-group > .btn-analysis.active .iconfont {
    color: #30adf2
}

body .view-bar .tabcontainer .btn-group .btn-analysis:first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

body .view-bar .tabcontainer .btn-group .btn-analysis:last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px
}

body .view-bar .cmdcontainer .iconfont, body .view-bar .tabcontainer .iconfont {
    font-size: 15px;
    line-height: 40px;
    display: block;
    float: left;
    margin: 0 6px;
    cursor: pointer;
    color: #4a4a4a
}

body .view-bar .cmdcontainer .iconfont.icon-fresh {
    font-size: 18px
}

body .view-bar .tabcontainer .btn-group > .btn .iconfont {
    line-height: 26px
}

body .view-bar .tabcontainer .iconfont.icon-join-inner {
    font-size: 26px
}

body .view-bar .cmdcontainer {
    position: absolute;
    left: 10px;
    top: 0
}

body .view-bar .tabcontainer {
    right: 10px;
    position: absolute;
    top: 0
}

body .view-bar .cmdcontainer em {
    border-left: 1px solid #dcdcdc;
    display: block;
    height: 20px;
    line-height: 20px;
    margin: 10px;
    float: left
}

body .view-bar .cmdcontainer .iconfont:hover, body .view-bar .nav span.iconfont.icon-edit:hover {
    color: #30adf2
}

body .workarea {
    overflow: auto;
    height: calc(100% - 40px);
    background: #fff
}

body .table-container {
    height: 100%;
    overflow-x: hidden;
    min-width: 100%
}

body .table-container .table-header {
    width: 100%;
    border-bottom: 1px solid #d2d2d2;
    height: 52px
}

body .table-container .table-header .head-col {
    border-top: 2px solid transparent;
    float: left;
    width: 150px;
    height: 52px;
    border-right: 1px solid #d2d2d2;
    padding: 0 10px;
    line-height: 24px;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    word-break: normal;
    text-overflow: ellipsis
}

body .table-container .table-header .head-col .iconfont {
    color: #64bd4f
}

body .table-container .table-header .head-col.active, body .table-container .table-header .head-col:hover {
    border-top: 2px solid #00afc7
}

body .table-container .table-header .head-col:hover .icon-config {
    display: inline-block;
    float: right
}

body .table-container .table-body {
    width: 100%;
    border-bottom: 1px solid #d2d2d2;
    overflow: hidden;
    overflow-y: auto;
    height: calc(100% - 60px)
}

body .table-container table {
    border: none;
    box-sizing: content-box
}

body .table-body td {
    width: 149px;
    height: 20px;
    padding: 0;
    border-top: none;
    border-bottom: 1px solid #cbcbcb;
    text-indent: 10px;
    word-break: break-all
}

body .table td:last-child {
    border-right: 1px solid #cbcbcb
}

body .table tr:last-child td {
    border-bottom: none
}

body .table tr td.active {
    background: #f7fcfe
}

body .table tr:nth-child(odd) {
    background: #f8f8f8
}

body .tablelist {
    height: 40px;
    border: 1px solid #ddd;
    border-top: none
}

body .tablelist .table-item {
    float: left;
    height: 39px;
    line-height: 39px;
    border-right: 1px solid #ddd;
    padding: 0 20px;
    background: #f9f9f9;
    cursor: pointer
}

body .tablelist .table-item.active {
    background: #fff
}

body .btns {
    position: absolute;
    bottom: 0;
    width: 100%;
    background: #f9f9f9;
    padding: 10px;
    text-align: center
}

body .btns .btn {
    margin-left: 20px
}

body .fresh:hover {
    color: #30adf2
}

body .fresh {
    font-size: 14px;
    margin-right: 20px;
    font-style: normal;
    cursor: pointer;
    line-height: 30px
}

body .self-dataset {
    margin: 40px 0 0 70px
}

body .dataset {
    line-height: 38px;
    background: #f9f9f9;
    padding: 0 20px;
    text-overflow: ellipsis;
    word-wrap: break-word;
    white-space: nowrap;
    overflow: hidden;
    background: #ececec;
    width: 260px;
    height: 40px;
    border-radius: 20px
}

body .dataset:before {
    font-family: iconfont;
    content: "\E6EB";
    font-size: 16px;
    color: #00c1de;
    position: absolute;
    left: 64px
}

body .link-dataset {
    margin-top: 40px
}

body .link-dataset .dataset:before {
    left: 108px
}

body .link-dataset .newdataset:before {
    content: ""
}

body .dataset .iconfont {
    width: auto;
    cursor: pointer
}

body .dataset .iconfont:last-child {
    margin-left: 0
}

body .dataset:hover {
    background: rgba(0, 192, 222, .1)
}

body .dataset .iconfont:hover {
    color: #30adf2
}

body .link-dataset ul li {
    padding-left: 114px;
    background: url() no-repeat;
    height: 70px;
    background-position: 0 -110px;
    color: #333;
    position: relative;
    cursor: pointer
}

body .link-dataset ul li:last-child {
    background-position: 0 -224px
}

body .link-dataset ul li:first-child {
    background-position: 0 8px
}

body .link-dataset ul li:only-child {
    background-position: 0 -298px
}

body .designmode-container, body .listmode-container {
    height: 410px;
    overflow-x: hidden;
    overflow-y: auto
}

body .newdataset {
    border: 1px dashed #c8c8c8;
    text-align: center;
    margin-left: 114px;
    cursor: pointer
}

body .link-type {
    position: absolute;
    left: 40px;
    top: 4px;
    width: 40px;
    height: 30px;
    background: url() 4px 5px no-repeat
}

body .link-type.LEFT_OUTER_JOIN {
    background-position: 5px -43px
}

body .ds-operatebtns {
    position: absolute;
    right: 8px;
    top: 0
}

body .table-container .table-header .head-col .dim {
    color: #56c8e2
}

body .blankrows {
    position: fixed;
    top: 40%;
    left: 45%;
    font-size: 30px;
    color: #fff;
    cursor: pointer;
    background: #000;
    padding: 10px;
    opacity: .5;
    border-radius: 10px
}

body .jointable {
    border-spacing: 0
}

body .jointable th {
    text-align: center
}

body .jointable tr td {
    height: 35px
}

body .jointable tr > td {
    text-align: center
}

body .jointable .line {
    background: url() no-repeat;
    background-position-x: 100px;
    width: 11px
}

body .jointable .link {
    height: 5px;
    width: 10px;
    display: inline-block;
    background-position-x: 0;
    background-position-y: -159px
}

body .jointable .link.leftlink {
    margin-left: -1px
}

body .jointable .link.rightlink {
    margin-right: -2px
}

body .jointable .line.left {
    background-position-x: 0;
    background-position-y: 100px
}

body .jointable .line.right {
    background-position-x: -35px;
    background-position-y: 100px
}

body .jointable .line.head {
    background-position-y: 17px
}

body .jointable .line.middle {
    background-position-y: -62px
}

body .jointable .line.tail {
    background-position-y: -140px
}

body .addbtn {
    width: 100%;
    font-size: 16px
}

body #jointable, body #jointype {
    padding-top: 8px
}

.modal-pullable .ant-modal-mask, .modal-pullable .ant-modal-wrap {
    top: 50px
}

.modal-pullable .ant-modal {
    position: absolute;
    margin: 0;
    top: 0;
    right: 0;
    padding-bottom: 0;
    height: 100%
}

.modal-pullable .ant-modal .ant-modal-content {
    height: 100%;
    border-radius: 0
}

.modal-pullable .ant-modal .ant-modal-content .ant-modal-header {
    display: flex;
    align-items: center;
    height: 80px;
    padding-left: 25px
}

.modal-pullable .ant-modal .ant-modal-content .ant-modal-header .ant-modal-title {
    font-size: 20px
}

.modal-pullable .ant-modal .ant-modal-content .ant-modal-body {
    padding: 0;
    height: calc(100% - 80px)
}

.modal-pullable .ant-modal .ant-form-item {
    margin-bottom: 10px
}

@keyframes modalPullableIn {
    0% {
        opacity: 0;
        transform-origin: right top;
        transform: scaleX(.6)
    }
    to {
        opacity: 1;
        transform-origin: right top;
        transform: scaleX(1)
    }
}

@keyframes modalPullableOut {
    0% {
        opacity: 1;
        transform-origin: right top;
        transform: scaleX(1)
    }
    to {
        opacity: 0;
        transform-origin: right top;
        transform: scaleX(.6)
    }
}

.modal-pullable .ant-modal.zoom-appear, .modal-pullable .ant-modal.zoom-enter, .modal-pullable .ant-modal.zoom-leave {
    animation-duration: .3;
    animation-fill-mode: both;
    animation-play-state: paused
}

.modal-pullable .ant-modal.zoom-leave {
    animation-duration: .2
}

.modal-pullable .ant-modal.zoom-appear.zoom-appear-active, .modal-pullable .ant-modal.zoom-enter.zoom-enter-active {
    animation-name: modalPullableIn;
    animation-play-state: running
}

.modal-pullable .ant-modal.zoom-leave.zoom-leave-active {
    animation-name: modalPullableOut;
    animation-play-state: running
}

.modal-pullable-body {
    height: calc(100% - 49px);
    padding: 16px;
    overflow: auto;
    background: hsla(0, 0%, 97%, .5)
}

.modal-pullable-footer {
    position: absolute;
    display: flex;
    justify-content: flex-end;
    width: 100%;
    padding: 10px 16px;
    border-top: 1px solid #e9e9e9;
    bottom: 0
}

.modal-pullable-footer button {
    padding: 0 30px;
    margin-left: 10px
}

.kui-masked-relative {
    position: relative
}

.kui-mask {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1040;
    background: rgba(0, 0, 0, .5)
}

.kui-mask-content {
    position: absolute;
    top: 50%;
    border: 1px solid #c3c3d6;
    background: #fff;
    z-index: 1050;
    padding: 6px;
    font-family: Microsoft YaHei;
    max-width: 200px
}

.kui-mask-loading, .kui-mask-text {
    display: table-cell;
    vertical-align: middle;
    word-break: break-all
}

.kui-mask-loading:before {
    content: "\E6C7";
    font-family: iconfont;
    width: 16px;
    height: 16px;
    display: inline-block;
    margin-right: 10px;
    color: #09c;
    font-size: 16px;
    animation: loading .5s;
    -moz-animation: loading .5s;
    -webkit-animation: loading .5s;
    -o-animation: loading .5s;
    animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    line-height: 16px
}

@keyframes loading {
    0% {
        transform: rotate(0deg)
    }
    25% {
        transform: rotate(90deg)
    }
    50% {
        transform: rotate(180deg)
    }
    75% {
        transform: rotate(270deg)
    }
    to {
        transform: rotate(1turn)
    }
}

@-moz-keyframes loading {
    0% {
        -moz-transform: rotate(0deg)
    }
    25% {
        -moz-transform: rotate(90deg)
    }
    50% {
        -moz-transform: rotate(180deg)
    }
    75% {
        -moz-transform: rotate(270deg)
    }
    to {
        -moz-transform: rotate(1turn)
    }
}

@-webkit-keyframes myfirst {
    0% {
        -webkit-transform: rotate(0deg)
    }
    25% {
        -webkit-transform: rotate(90deg)
    }
    50% {
        -webkit-transform: rotate(180deg)
    }
    75% {
        -webkit-transform: rotate(270deg)
    }
    to {
        -webkit-transform: rotate(1turn)
    }
}

.kui-overlay {
    background: #fff;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .5);
    position: absolute;
    z-index: 5000;
    min-height: 200px;
    min-width: 300px;
    border: 1px solid rgba(0, 0, 0, .3)
}

.kui-dialog {
    z-index: 5001
}

.kui-alert {
    z-index: 5002
}

.kui-overlay .kui-overlay-header {
    padding: 0 60px 0 30px;
    height: 40px;
    border-bottom: 1px solid #eee;
    line-height: 40px;
    font-size: 14px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.kui-overlay .kui-overlay-body, .kui-overlay .kui-overlay-header {
    font-family: Helvetica Neue, Verdana, Tahoma, Lantinghei SC, Hiragino Sans GB, Microsoft YaHei, \\5FAE\8F6F\96C5\9ED1, sans-serif !important
}

.kui-overlay .kui-overlay-body {
    padding: 20px;
    font-size: 12px;
    color: #666;
    line-height: 24px;
    text-align: left;
    background: #fff
}

.kui-overlay .kui-overlay-footer {
    height: 40px;
    border-top: 1px solid #eee;
    line-height: 38px;
    text-align: right;
    padding: 0 15px;
    background: #fff
}

.kui-overlay .kui-overlay-footer button {
    margin-left: 15px
}

.kui-overlay .kui-remover {
    position: absolute;
    top: 14px;
    right: 20px;
    font-size: 20px;
    color: #aeaeae;
    cursor: pointer
}

.kui-alert-type {
    font-size: 30px !important;
    margin: 0 10px;
    vertical-align: middle;
    padding-right: 20px
}

.kui-alert-type.icon-success {
    color: #87d068
}

.kui-alert-type.icon-error {
    color: #f05634
}

.kui-alert-type.icon-info {
    color: #00c1de
}

.kui-alert-type.icon-warning {
    color: #fa0
}

.kui-alert-type.icon-question {
    color: #00c1de
}

.kui-alert-type, .msginfo {
    display: table-cell;
    word-break: break-all;
    font-size: 14px
}

.kui-overlay .msginfo .kui-msg {
    max-height: 250px;
    overflow-x: hidden;
    overflow-y: auto
}

.moretag {
    text-align: right;
    cursor: pointer;
    color: #00c1de;
    font-size: 12px
}

.moremsgcontainer {
    clear: both;
    max-height: 100px;
    min-height: 40px;
    overflow: auto;
    border: 1px solid #ccc;
    font-size: 12px
}

.moremsgcontainer textarea {
    width: 100%;
    min-height: 40px;
    max-height: 100px;
    border: none
}

.moremsgcontainer textarea:focus {
    outline: none
}

.kui-overlay-loading {
    line-height: 20px;
    margin-top: 20px
}

.kui-overlay-loading .kui-mask-loading {
    display: inline-block
}

.kui-grid {
    border: 1px solid transparent;
    overflow: hidden;
    width: 100%
}

.kui-grid table {
    width: 100%;
    border-spacing: 0
}

.kui-grid .kui-grid-header table > thead > tr > th {
    height: 40px;
    line-height: 30px;
    border-bottom: 1px solid #ececec;
    background: #eee;
    padding: 0 8px;
    cursor: pointer
}

.kui-grid .kui-grid-body table > thead > tr > th {
    padding: 0 8px
}

.kui-grid .kui-grid-header table > thead > tr > th:hover {
    background: rgba(248, 252, 253, .85)
}

.kui-grid .kui-grid-header table > thead > tr > th .iconfont {
    float: right;
    font-size: 12px;
    color: #ccc
}

.kui-grid .kui-grid-header table > thead > tr > th.sort-asc .iconfont:before {
    content: "\E6C6";
    color: #00c1de
}

.kui-grid .kui-grid-header table > thead > tr > th.sort-desc .iconfont:before {
    content: "\E6C5";
    color: #00c1de
}

.kui-grid .kui-grid-header table > thead > tr > th:first-child {
    border-left: none
}

.kui-empty-columns {
    padding: 20px;
    font-size: 14px;
    text-align: center
}

.kui-empty-columns .icon-info {
    color: #09c;
    font-size: 20px
}

.kui-empty-columns label {
    font-size: 16px;
    margin-left: 10px
}

.kui-grid .kui-grid-body {
    overflow: auto
}

.kui-grid .kui-grid-body table > tbody > tr:nth-child(2n) {
    background: #fff
}

.kui-grid .kui-grid-body table > tbody > tr.active, .kui-grid .kui-grid-body table > tbody > tr:hover {
    background: rgba(248, 252, 253, .85)
}

.kui-grid .kui-grid-body table > tbody > tr > td {
    padding: 12px 8px;
    border-top: 0;
    border-bottom: 1px solid #ececec;
    vertical-align: middle;
    word-break: break-all
}

.kui-grid .pagingbar {
    height: 40px;
    text-align: right;
    padding: 6px
}

.no-data {
    text-align: center
}

.kui-overlay .kui-overlay-body {
    padding: 15px;
    overflow: auto
}

#grid_download_data {
    max-height: 400px;
    overflow: auto
}

.hide {
    display: none
}

.desktop a, .desktop a:hover {
    color: #666
}

.kui-grid .kui-grid-header table > thead > tr > th .iconfont {
    margin-top: 10px
}

.kui-grid .kui-grid-header table > thead > tr > th.sort-asc .iconfont:before {
    color: #ccc;
    content: "\E63D"
}

.kui-grid .kui-grid-header table > thead > tr > th.sort-desc .iconfont:before {
    color: #ccc;
    content: "\E63C"
}

input::-webkit-inner-spin-button, input::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

.config-data-container .table-distinct {
    padding: 3px;
    padding-left: 10px
}

.config-data-container .config-data-item {
    position: relative
}

.config-data-container .config-data-item .area-name {
    padding: 5px;
    background-color: #fff
}

.config-data-container .config-data-item .column-list {
    min-height: 50px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #f8f8f8
}

.config-data-container .config-data-item .column-list .column-item {
    margin: 5px;
    text-align: left;
    padding: 0 10px;
    background: #def1f6;
    border: 1px solid #00c1de;
    border-radius: 4px;
    height: 26px;
    line-height: 24px
}

.config-data-container .config-data-item .column-list .column-item span.button {
    color: #56c8e2;
    position: absolute;
    left: 8px
}

.config-data-container .config-data-item .column-list .column-item .icon-aggregate {
    position: absolute;
    left: 30px;
    color: #6f6f6f
}

.config-data-container .config-data-item .column-list .column-item .icon-remove {
    font-size: 12px;
    cursor: pointer
}

.config-data-container .config-data-item .column-list .column-item .data-item {
    display: inline-block;
    width: calc(100% - 60px);
    overflow: hidden;
    text-overflow: ellipsis;
    height: 24px;
    margin-left: 34px;
    white-space: nowrap
}

.config-data-container .config-data-item .column-list .column-item .data-dim-item {
    width: calc(100% - 40px);
    margin-left: 14px
}

.config-data-container .config-data-item .column-list .sortable-chosen span.button {
    left: 2px
}

.config-data-container .config-data-item .column-list .sortable-chosen .icon-aggregate {
    left: 24px
}

.config-data-container .config-data-item .column-list .column-measure {
    /*
    background: #ddeed5;
    border: 1px solid #64bd4f;
    */
    background: #def1f6;
    border: 1px solid #00c1de;
}

.config-data-container .config-data-item .column-list .column-measure span.button {
    color: #64bd4f
}

.config-data-container .config-data-item .column-list li span.button:before {
    font-family: iconfont;
    padding-left: 2px;
    display: inline-block;
    font-size: 16px;
    content: "?";
    -webkit-font-smoothing: antialiased
}

.config-data-container .config-data-item .column-list li span.button.string_ico_docu:before, .config-data-container .config-data-item .column-list li span.button.STRING_ico_docu:before {
    content: "\E809"
}

.config-data-container .config-data-item .column-list li span.button.number_ico_docu:before, .config-data-container .config-data-item .column-list li span.button.NUMBER_ico_docu:before {
    content: "\E796"
}

.config-data-container .config-data-item .column-list li span.button.location_ico_docu:before, .config-data-container .config-data-item .column-list li span.button.LOCATION_ico_docu:before {
    content: "\E6D8"
}

.config-data-container .config-data-item .column-list li span.button.datetime_ico_docu:before, .config-data-container .config-data-item .column-list li span.button.DATETIME_ico_docu:before {
    content: "\E807"
}

.config-data-container .config-data-item .column-list li span.button.calc_ico_docu:before {
    content: "\E6CE";
    font-size: 13px;
    margin-left: 2px
}

.config-data-container .config-data-item .no-column-tip {
    position: absolute;
    top: 60%;
    left: 15%;
    color: #9e9e9e
}

.config-data-container .refresh-panel {
    padding: 5px
}

.config-data-container .refresh-panel span {
    color: #cbc8c9
}

.config-data-container .refresh-panel .iconfont.icon-fresh {
    color: #fff;
    font-size: 12px;
    font-weight: 700
}

.config-data-container .refresh-panel .btn-update {
    border-style: none !important;
    background: #00c1de !important;
    border-radius: 2px !important
}

.config-data-container .preview-panel {
    text-align: center;
    margin: 5px;
    padding: 10px 0;
    border-top: 1px solid #e2e2e2
}

.config-data-container .preview-panel input, .config-data-container .preview-panel select {
    width: 130px !important
}

.config-data-container .sortable-ghost {
    opacity: .4
}

.config-data-container select {
    -moz-appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
    padding: 2px 20px 2px 4px;
    border: 1px solid #dadada;
    min-width: 80px;
    width: 100%;
    background: url() #fff 100% no-repeat
}

.config-data-container .icon-filter, .config-data-container .icon-sort-down, .config-data-container .icon-sort-none, .config-data-container .icon-sort-up {
    font-size: 14px;
    margin-top: 2px;
    color: #b3b3b3;
    cursor: pointer
}

.config-data-container .icon-sort-down, .config-data-container .icon-sort-up {
    color: #00abfc;
    margin: 0
}

.config-data-container .icon-sort-none {
    margin: 0
}

.config-data-container .highlight {
    color: #3babff
}

.config-data-container .component-query-type {
    display: flex;
    margin: 0 10px;
    border: 1px solid #00c1de;
    border-radius: 3px
}

.config-data-container .component-query-type li {
    flex: 1;
    text-align: center;
    border-right: 1px solid #00c1de;
    color: #00c1de;
    height: 24px;
    line-height: 24px;
    cursor: default
}

.config-data-container .component-query-type li:last-child {
    border-right: none
}

.config-data-container .component-query-type li.active {
    background: #00c1de;
    color: #fff
}

.config-data-container .sort-list li .orderitem {
    width: 110px;
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    height: 16px
}

.config-data-container .aggregate-list {
    position: absolute;
    margin-top: -7px;
    margin-left: 12px
}

.config-data-container .aggregate-list .kui-list-item {
    height: 26px;
    width: 90px;
    line-height: 18px
}

.config-data-container .aggregate-list .kui-list-item .iconfont {
    float: left
}

.config-data-container .aggregate-list .kui-list-item .aggregate-text {
    transform: scale(.9);
    margin-left: -16px;
    margin-top: 2px;
    display: inline-block
}

.config-data-container .changerc {
    position: absolute;
    top: 8px;
    right: 8px;
    cursor: pointer
}

.config-data-container.dashconfig {
    position: relative
}

.config-data-container.dashconfig .changerc {
    top: 4px
}

.filter-config-modal {
    margin: -20px auto;
    max-height: 500px
}

.widget-filter-modal-container .ant-calendar-picker {
    width: 140px
}

.widget-filter-modal-container .input {
    height: 28px;
    border: 1px solid #ccc;
    padding: 4px 6px;
    background-color: #fff
}

.widget-filter-modal-container .queryfield-string-panel {
    min-height: 350px
}

.widget-filter-modal-container .queryfield-panel .button-group-item {
    color: #666;
    border-color: #bbb
}

.widget-filter-modal-container .input-group {
    display: -webkit-flex;
    display: flex;
    position: relative;
    border-collapse: separate
}

.widget-filter-modal-container .input-group .input[type=text] {
    flex: 1;
    background-color: transparent;
    width: 100%
}

.widget-filter-modal-container .input-group .input-group-addon {
    line-height: 25px;
    width: 76px;
    padding: 0;
    font-size: 12px;
    white-space: nowrap;
    vertical-align: middle;
    text-align: center;
    background-color: #f9f9f9;
    border: 1px solid #ccc;
    border-radius: 2px;
    flex: none
}

.widget-filter-modal-container .input-group .input-group-addon .widget-config-select {
    width: 75px;
    height: 25px;
    border: none;
    outline: none !important
}

.widget-filter-modal-container .input-group .input-group-addon:first-child {
    border-right: 0
}

.widget-filter-modal-container .select-string-enumerate {
    height: 260px;
    width: 100%
}

.widget-filter-modal-container .widget-config input[name=labelName] {
    width: calc(100% - 42px);
    margin-left: 5px
}

.widget-filter-modal-container .widget-config-select {
    width: 100%;
    height: 28px;
    border: none;
    outline: 1px solid #ccc;
    background: url() #fff 100% no-repeat;
    -webkit-appearance: none;
    padding: 0 5px
}

.widget-filter-modal-container .component-condition-type, .widget-filter-modal-container .component-range-type, .widget-filter-modal-container .component-time-type {
    display: flex;
    margin: 10px 0;
    border: 1px solid #00c1de;
    border-radius: 3px
}

.widget-filter-modal-container .component-condition-type li, .widget-filter-modal-container .component-range-type li, .widget-filter-modal-container .component-time-type li {
    flex: 1;
    text-align: center;
    border-right: 1px solid #00c1de;
    color: #00c1de;
    height: 24px;
    line-height: 24px;
    cursor: default
}

.widget-filter-modal-container .component-condition-type li:last-child, .widget-filter-modal-container .component-range-type li:last-child, .widget-filter-modal-container .component-time-type li:last-child {
    border-right: none
}

.widget-filter-modal-container .component-condition-type li.active, .widget-filter-modal-container .component-range-type li.active, .widget-filter-modal-container .component-time-type li.active {
    background: #00c1de;
    color: #fff
}

.widget-filter-modal-container .config-section {
    padding: 8px 5px;
    border-top: 1px solid #ccc;
    color: #666
}

.widget-filter-modal-container .config-section h3 {
    font-size: 12px;
    font-weight: 400;
    margin-top: 10px;
    color: #999
}

.widget-filter-modal-container .config-section:first-child {
    border-top: none
}

.widget-filter-modal-container .config-section .config-section-row {
    padding: 5px 0
}

.widget-filter-modal-container .config-section .config-section-row:after {
    display: table;
    content: " ";
    clear: both
}

.widget-filter-modal-container .component-time-config {
    color: #333
}

.widget-filter-modal-container .component-time-config .time-shortcut li {
    float: left;
    height: 30px;
    line-height: 30px;
    color: #00c1de;
    width: 48%;
    border: 1px solid #00c1de;
    text-align: center;
    border-radius: 3px;
    margin-bottom: 10px;
    cursor: default
}

.widget-filter-modal-container .component-time-config .time-shortcut li.active {
    color: #fff;
    background: #00c1de
}

.widget-filter-modal-container .component-time-config .time-shortcut li:nth-child(2n) {
    margin-left: 4%
}

.widget-filter-modal-container .component-time-config .time-tip {
    margin-bottom: 10px;
    display: -webkit-flex;
    display: flex;
    height: 30px;
    line-height: 30px;
    background-color: #f8f8f8;
    border: 1px solid #cbcbcb;
    padding: 0 5px
}

.widget-filter-modal-container .component-time-config .time-tip select {
    background: #f8f8f8;
    width: 36px;
    margin: 0 3px;
    border: 0;
    outline: 0
}

.widget-filter-modal-container .component-time-config .time-tip input[type=text] {
    text-align: right;
    height: 22px;
    line-height: 22px;
    width: 100px;
    border: 1px solid #cbcbcb;
    padding: 4px
}

.widget-filter-modal-container .component-time-config .time-tip .time-tip-item {
    flex: 2;
    display: -webkit-flex;
    display: flex;
    align-items: center
}

.widget-filter-modal-container .component-time-config .time-tip .time-tip-item.hide {
    display: none !important
}

.widget-filter-modal-container .component-time-config .time-tip .time-tip-item:last-child {
    justify-content: flex-end
}

.widget-filter-modal-container .component-time-config .time-tip .time-tip-split {
    flex: .5;
    text-align: center
}

.widget-filter-modal-container .component-time-config .time-tip .time-tip-split.hide {
    display: none
}

.widget-filter-modal-container .time-container .mydrp {
    width: 100% !important
}

.widget-filter-modal-container .time-container .component-time {
    display: -webkit-flex;
    display: flex;
    font-size: 12px;
    align-items: center
}

.widget-filter-modal-container .time-container .component-time input {
    line-height: normal
}

.widget-filter-modal-container .time-container .component-time .component-time-input {
    height: 26px;
    flex: 1;
    display: -webkit-flex;
    display: flex
}

.widget-filter-modal-container .time-container .component-time .component-split {
    margin: 0 6px;
    line-height: 28px
}

.widget-filter-modal-container .time-container .component-time .component-time-input[type=text] {
    min-width: 40px
}

.main-widget .tab {
    position: relative;
    height: 30px;
    width: 100%
}

.main-widget .tab li {
    height: 28px;
    padding-top: 5px;
    text-align: center;
    border-bottom: 1px solid #dcdee3;
    border-right: 1px solid #dcdee3;
    border-top: 2px solid transparent;
    float: left;
    background: #f8f8f8
}

.main-widget .tab li.active {
    border-top: 2px solid #00c1de;
    border-bottom: none;
    background-color: #fff
}

.main-widget .icon-box {
    width: 30px;
    border-left: 1px solid #d5d5d5;
    height: 27px;
    position: absolute;
    right: 0;
    top: 0;
    text-align: center;
    padding-top: 5px
}

.main-widget .chart-list {
    padding: 5px 0 5px 5px
}

.main-widget .chart-list li {
    height: 30px;
    width: 30px;
    background: #fff;
    margin-right: 2px;
    cursor: pointer;
    display: inline-block;
    border: 1px solid transparent
}

.main-widget .chart-list li.active {
    border: 1px solid #00c1de;
    box-shadow: 0 3px 10px #99ecf9
}

.main-widget .chart-list li.hide {
    display: none
}

.main-widget .chart-list li:hover {
    border: 1px solid #00c1de
}

.main-widget .widget-chart {
    background-color: #fff
}

.main-widget .widget-chart .tab ul li.active {
    width: 85px
}

.main-widget .widget-chart .tab ul li.last {
    width: calc(100% - 85px)
}

.main-widget .widget-component {
    background-color: #fff
}

.main-widget .widget-component .tab ul li.active {
    width: 45px
}

.main-widget .widget-component .tab ul li.last {
    width: calc(100% - 45px)
}

.main-widget .widget-config .tab ul li {
    width: 45px;
    border-right: none;
    cursor: pointer
}

.main-widget .widget-config .tab ul li.active {
    border-left: 1px solid #dcdee3;
    border-right: 1px solid #dcdee3
}

.main-widget .widget-config .tab ul li:first-child {
    border-left: none
}

.main-widget .widget-config .tab ul li.last {
    width: calc(100% - 90px)
}

.main-widget .widget-config .tab ul li.last.long {
    width: calc(100% - 135px)
}

.main-widget .widget-config .config-line {
    width: 100%;
    height: 30px
}

.main-widget .widget-config .config-line.pic-config-title {
    margin-top: 10px
}

.main-widget .widget-config .config-line > *, .main-widget .widget-config .config-line input[type=number], .main-widget .widget-config .config-line input[type=text] {
    float: left;
    display: block;
    height: 26px
}

.main-widget .widget-config .config-line .pic-select {
    width: 100%
}

.main-widget .widget-config .config-line .pre-select {
    width: 50%
}

.main-widget .widget-config .config-line .btn-select {
    width: 50%;
    padding: 2px 0
}

.main-widget .widget-config .config-line .btn-select select {
    -moz-appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
    padding: 2px 20px 2px 4px;
    border: 1px solid #dadada;
    min-width: 80px;
    height: 26px;
    line-height: 22px;
    width: 100%;
    background: url() #fff 100% no-repeat
}

.main-widget .widget-config .config-line.no-check .pre-select {
    width: 30%;
    padding-left: 0;
    padding-right: 0
}

.main-widget .widget-config .config-line.no-check .btn-select {
    width: 68%
}

.main-widget .widget-config .config-line.no-check .line {
    width: 46%
}

.main-widget .widget-config .config-header {
    width: 100%;
    position: relative
}

.main-widget .widget-config .config-header .iconfont {
    margin-left: 5px;
    font-size: 12px
}

.main-widget .widget-config .config-header .line {
    border-top: 1px solid #dcdee3;
    width: calc(100% - 50px);
    display: block;
    position: absolute;
    right: 0;
    top: 9px
}

.main-widget .widget-config .config-wraper {
    padding: 5px 2px;
    padding-bottom: 0
}

.main-widget .widget-config .config-style {
    padding: 0 5px
}

.main-widget .widget-config .config-style .config-style-layout .input-right {
    margin-right: 5px
}

.main-widget .widget-config .config-style .config-style-layout .config-caption label {
    width: 40%;
    padding-top: 8px
}

.main-widget .widget-config .config-style .config-style-layout .config-caption input[type=text] {
    width: 55%;
    height: 30px
}

.main-widget .widget-config .config-style .config-style-layout .config-position a {
    width: 30%;
    padding-top: 5px;
    text-align: center;
    border-top: 1px solid #bbb;
    border-left: 1px solid #bbb;
    border-bottom: 1px solid #bbb;
    color: #666
}

.main-widget .widget-config .config-style .config-style-layout .config-position a:last-child {
    border-right: 1px solid #ccc
}

.main-widget .widget-config .config-style .config-style-layout .config-position a.active {
    background-color: #00c1de
}

.main-widget .widget-config .config-style .config-style-layout .config-height-width label {
    width: 45%
}

.main-widget .widget-config .config-style .config-style-layout .config-height-width label input[type=text] {
    width: 50px;
    height: 30px;
    margin-left: 5px
}

.main-widget .widget-config .config-style .config-style-layout .config-preview-show label {
    padding-top: 8px
}

.main-widget .widget-config-bg {
    background: url(//g.alicdn.com/qbi/qbi/1.1.4/intro-data.png) no-repeat;
    width: 100%;
    height: 476px
}

.main-widget span[class*=" sc-"] {
    width: 28px;
    height: 28px;
    background-size: 100% 100%;
    display: block
}

.main-widget span.sc-query {
    height: 30px
}

.main-widget .sc-bar {
    background: url() no-repeat 0 0
}

.main-widget .sc-line {
    background: url() no-repeat 0 0
}

.main-widget .sc-pie {
    background: url() no-repeat 0 0
}

.main-widget .sc-map-bubble {
    background: url() no-repeat 0 0
}

.main-widget .sc-map-color {
    background: url() no-repeat 0 0
}

.main-widget .sc-table {
    background: url() no-repeat 0 0
}

.main-widget .sc-calendar {
    background: url() no-repeat 0 0
}

.main-widget .sc-text {
    background: url() no-repeat 0 0
}

.main-widget .sc-query {
    background: url() no-repeat 0 0
}

.main-widget .sc-gauge {
    background: url() no-repeat 0 0
}

.main-widget .sc-scatter {
    background: url() no-repeat 0 0
}

.main-widget .sc-radar {
    background: url() no-repeat 0 0
}

.main-widget .sc-funnel {
    background: url() no-repeat 0 0
}

.main-widget .sc-indicator {
    background: url() no-repeat 0 0
}

.main-widget .sc-treemap {
    background: url() no-repeat 0 0
}

.main-widget .sc-polar {
    background: url() no-repeat 0 0
}

.main-widget .sc-wordCloud {
    background: url() no-repeat 0 0
}

.main-widget .sc-tornado {
    background: url() no-repeat 0 0
}

.main-widget .sc-tree {
    background: url() no-repeat 0 0
}

.main-widget .sc-path {
    background: url() no-repeat 0 0
}

.main-widget .sc-iframe {
    background: url() no-repeat 0 0
}

.main-widget .sc-tab {
    background: url() no-repeat 0 0
}

.main-widget .sc-pic {
    background: url() no-repeat 0 0
}

.main-widget .sc-map-lbs {
    background: url() no-repeat 0 0;
    border: 1px solid #99ecf9
}

.widget-container > .widget-config {
    overflow: auto
}

.qbi-bar-config {
    width: 100%
}

.config-icon {
    margin-bottom: 10px
}

.config-icon .form-checkbox {
    padding: 0;
    line-height: normal;
    color: #d8d8d8;
    margin-right: 10px
}

.config-icon .form-checkbox .iconfont {
    font-size: 27px;
    height: 27px
}

.config-icon .active {
    color: #00c1de;
    box-shadow: 0 3px 10px #99ecf9
}

.config-icon .active .icon-indicator0 {
    background-image: url()
}

.config-icon .active .icon-indicator1 {
    background-image: url()
}

.config-icon .active .icon-indicator2 {
    background-image: url()
}

.config-icon .icon {
    height: 30px;
    width: 30px;
    display: block;
    background-size: cover
}

.config-icon .icon-indicator0 {
    background-image: url()
}

.config-icon .icon-indicator1 {
    background-image: url()
}

.config-icon .icon-indicator2 {
    background-image: url()
}

.main-widget .widget-config .config-line.config-lists {
    height: auto
}

.main-widget .widget-config .config-line.config-lists label {
    display: inline-block;
    float: none;
    width: 48%
}

.main-widget .widget-config h3.config-header .vice {
    font-size: 8px;
    font-weight: 400
}

.main-widget .widget-config h3.config-header.vice .line {
    width: 30px
}

.main-widget .widget-config h3.config-header .line.short {
    width: 90px
}

.qbi-bar-config {
    width: 100%
}

.qbi-bar-config .config-line label {
    width: 40%;
    padding-top: 6px
}

.qbi-bar-config .config-line .pie-style {
    width: 30%
}

.qbi-bar-config .config-line.config-lists {
    height: auto
}

.qbi-bar-config .config-line.config-lists label {
    display: inline-block;
    float: none;
    width: 48%
}

.qbi-bar-config {
    width: 100%
}

.qbi-bar-config .config-line.config-lists {
    height: auto
}

.qbi-bar-config .config-line.config-lists label {
    display: inline-block;
    float: none;
    width: 48%
}

.qbi-bar-config {
    width: 100%
}

.qbi-bar-config .config-line.config-lists {
    height: auto
}

.qbi-bar-config .config-line.config-lists label {
    display: inline-block;
    float: none;
    width: 48%
}

.qbi-bar-config {
    width: 100%
}

.qbi-bar-config .config-line.config-lists {
    height: auto
}

.qbi-bar-config .config-line.config-lists label {
    display: inline-block;
    float: none;
    width: 48%
}

qbi-select {
    float: left;
    margin-right: 4px
}

.rule-row {
    margin-top: 6px;
    white-space: nowrap
}

colorbox {
    height: 22px;
    width: 22px;
    display: block
}

.kui-select-text colorbox {
    height: 16px;
    width: 16px;
    margin-top: 7px
}

.tab-bar {
    display: flex;
    margin: 3px 0;
    border: 1px solid #00c1de;
    border-radius: 3px
}

.tab-bar li {
    flex: 1;
    text-align: center;
    border-right: 1px solid #00c1de;
    color: #00c1de;
    height: 24px;
    line-height: 24px;
    cursor: default
}

.tab-bar li:last-child {
    border-right: none
}

.tab-bar li.active {
    background: #00c1de;
    color: #fff
}

.qbi-gauge-config .hide {
    display: none !important
}

.qbi-gauge-config .config-line.no-check.line {
    margin-top: 30px;
    border-top: 1px solid #dcdee3
}

.qbi-gauge-config .config-line .angle, .qbi-gauge-config .config-line .real {
    height: 30px;
    width: 100%
}

.qbi-gauge-config .config-line .rela {
    position: relative;
    height: 30px
}

.qbi-gauge-config .config-line .angle input {
    width: 23%;
    margin-right: 4px
}

.qbi-gauge-config .config-line .angle input.first {
    width: 30%
}

.qbi-gauge-config .config-line .angle input.last {
    margin-top: 6px;
    height: 15px;
    width: 18px;
    border-radius: 4px
}

.qbi-gauge-config .config-line .iconfont {
    color: #00c1de
}

.qbi-gauge-config .config-line .iconfont.icon-delete2 {
    top: 6px;
    position: absolute;
    right: -5px;
    cursor: pointer
}

.qbi-gauge-config .config-line.operate span {
    margin-top: 5px;
    cursor: pointer
}

.qbi-gauge-config .config-line.operate button {
    float: right
}

.qbi-indicator-config .config-line.hide.show {
    display: block
}

.qbi-indicator-config .config-line .btn-select .select {
    position: relative
}

.qbi-indicator-config .config-line .green {
    color: #40de5a
}

.qbi-indicator-config .config-line .red {
    color: #f15e5e
}

.qbi-indicator-config .config-line .normal {
    color: #fba731
}

.qbi-indicator-config .J-get-option {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 30px;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ddd;
    color: #666;
    font-size: 12px;
    line-height: normal;
    padding: 6px;
    -webkit-appearance: none;
    outline: 0
}

.qbi-indicator-config .J-get-option .select-tag {
    position: absolute;
    top: 0;
    right: 5px;
    color: #999;
    margin-top: 3px
}

.qbi-indicator-config .J-option-list {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 104px;
    padding: 2px 0;
    z-index: 1000;
    background-color: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    background-clip: padding-box;
    border: 1px solid #ccc;
    margin-top: 2px;
    overflow-y: auto;
    max-height: 600px;
    width: 100%;
    border-top: none;
    min-height: 30px
}

.qbi-indicator-config .J-option-list .item {
    display: block;
    padding: 5px 6px;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #333;
    cursor: pointer;
    white-space: nowrap
}

.qbi-indicator-config .J-option-list .item.selected {
    background: #00aafb;
    opacity: .8;
    color: #fff
}

.qbi-tornado-config .J-partition-item {
    margin-top: 5px
}

.qbi-tornado-config .J-partition-item > label {
    padding-top: 5px;
    width: 20%
}

.qbi-tornado-config .J-partition-item > input {
    width: 28%
}

.qbi-tree-config .config-line.config-lists {
    height: 60px
}

.qbi-tree-config .config-line.level {
    margin-bottom: 10px
}

.qbi-tree-config .config-line .pre-label {
    width: 20%;
    padding-top: 6px
}

.qbi-tree-config .config-line .label, .qbi-tree-config .config-line > input {
    width: 40%
}

.qbi-path-config .hide {
    display: none
}

.qbi-path-config .bar-design .config-line.config-lists {
    height: 30px
}

.qbi-path-config .bar-design .config-line.config-lists label {
    float: left
}

.qbi-path-config .bar-design .config-line.config-lists input {
    margin-top: 2px;
    margin-left: 5px;
    width: 45%
}

.qbi-path-config .form-checkbox input:disabled + .form-icon, .qbi-path-config .form-radio input:disabled + .form-icon {
    background-color: #d8d8d8 !important;
    border: 1px solid #d8d8d8 !important
}

.qbi-path-config .config-line.hide.show {
    display: block
}

.qbi-path-config .config-line .btn-select .select {
    position: relative
}

.qbi-path-config .config-line .green {
    color: #40de5a
}

.qbi-path-config .config-line .red {
    color: #f15e5e
}

.qbi-path-config .config-line .normal {
    color: #fba731
}

.qbi-path-config .config-set {
    min-height: 100px
}

.qbi-path-config .J-get-option {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 30px;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ddd;
    color: #666;
    font-size: 12px;
    line-height: normal;
    padding: 6px;
    -webkit-appearance: none;
    outline: 0
}

.qbi-path-config .J-get-option .select-tag {
    position: absolute;
    top: 0;
    right: 5px;
    color: #999;
    margin-top: 3px
}

.qbi-path-config .J-option-list {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 104px;
    padding: 2px 0;
    z-index: 1000;
    background-color: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    background-clip: padding-box;
    border: 1px solid #ccc;
    margin-top: 2px;
    overflow-y: auto;
    max-height: 600px;
    width: 100%;
    border-top: none;
    min-height: 30px
}

.qbi-path-config .J-option-list .item {
    display: block;
    padding: 5px 6px;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #333;
    cursor: pointer;
    white-space: nowrap
}

.qbi-path-config .J-option-list .item.selected {
    background: #00aafb;
    opacity: .8;
    color: #fff
}

.qbi-bar-config {
    width: 100%
}

.qbi-bar-config .config-line.config-lists {
    height: auto
}

.qbi-bar-config .config-line.config-lists label {
    display: inline-block;
    float: none;
    width: 48%
}

.widget-config-panel .gray {
    color: #999
}

.widget-config-panel a {
    color: #333;
    text-decoration: none
}

.widget-config-panel .input {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 30px;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ddd;
    color: #666;
    font-size: 12px;
    line-height: normal;
    padding: 6px;
    -webkit-appearance: none;
    outline: 0
}

.widget-config-panel .component-tab-nav {
    display: -webkit-flex;
    display: flex
}

.widget-config-panel .component-tab-nav:after {
    display: table;
    content: " ";
    clear: both;
    box-sizing: border-box
}

.widget-config-panel .component-tab-nav > li {
    -webkit-flex: 1;
    flex: 1;
    float: left;
    cursor: default
}

.widget-config-panel .component-tab-nav > li a {
    padding: 5px;
    display: block;
    margin: 0;
    text-align: center;
    font-size: 12px;
    border-right: 1px solid #dcdee3;
    border-bottom: 1px solid #dcdee3;
    background-color: #f8f8f8
}

.widget-config-panel .component-tab-nav > li:last-child a {
    border-right: 0 none
}

.widget-config-panel .component-tab-panel {
    display: none
}

.widget-config-panel .component-tab-panel.active {
    display: block
}

.widget-config-panel .config-section {
    padding: 8px 5px;
    border-top: 1px solid #ccc;
    color: #666
}

.widget-config-panel .config-section h3 {
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 10px
}

.widget-config-panel .config-section:first-child {
    border-top: none
}

.widget-config-panel .config-section .config-section-row {
    padding: 5px 0
}

.widget-config-panel .config-section .config-section-row:after {
    display: table;
    content: " ";
    clear: both
}

.widget-config-panel .dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 104px;
    padding: 2px 0;
    z-index: 1000;
    display: none;
    background-color: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    background-clip: padding-box;
    border: 1px solid #ccc
}

.widget-config-panel .dropdown-menu .item {
    display: block;
    padding: 5px 6px;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #333;
    cursor: pointer;
    white-space: nowrap
}

.widget-config-panel .dropdown-menu .item.selected {
    background: #00aafb;
    color: #fff
}

.widget-config-panel .dropdown-menu .item:hover {
    background: #00aafb;
    opacity: .8;
    color: #fff
}

.widget-config-panel .select {
    cursor: pointer;
    position: relative
}

.widget-config-panel .select.open .dropdown-menu {
    display: block
}

.widget-config-panel .select.open .input {
    color: #333;
    border-color: #00aafb;
    box-shadow: 0 0 2px 0 #00aafb
}

.widget-config-panel .select.open .input i {
    color: #00aafb
}

.widget-config-panel .select .input .sel-value {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 95%
}

.widget-config-panel .select .input i {
    position: absolute;
    top: 0;
    right: 5px;
    color: #999;
    margin-top: 3px
}

.widget-config-panel .select .dropdown-menu {
    margin-top: 2px;
    overflow-y: auto;
    max-height: 600px;
    width: 100%;
    border-top: none;
    min-height: 30px
}

.widget-config-panel .queryfield-panel .button-group-item {
    color: #00c1de;
    border-color: #00c1de
}

.widget-config-panel .button-group.button-group-flex {
    display: -webkit-flex;
    display: flex
}

.widget-config-panel .button-group.button-group-flex .button-group-item {
    -webkit-flex: 1;
    flex: 1
}

.widget-config-panel .button-group .button-group-item {
    float: left;
    border-top: 1px solid #00c1de;
    border-left: 1px solid #00c1de;
    border-bottom: 1px solid #00c1de;
    padding: 5px 10px 3px;
    background: #fff;
    color: inherit;
    text-align: center;
    cursor: pointer
}

.widget-config-panel .button-group .button-group-item:first-child {
    border-radius: 3px 0 0 3px
}

.widget-config-panel .button-group .button-group-item:last-child {
    border-right: 1px solid #ccc;
    border-radius: 0 3px 3px 0
}

.widget-config-panel .button-group .button-group-item:after {
    display: table;
    content: " ";
    clear: both
}

.widget-config-panel .button-group .button-group-item.active {
    background: #00c1de;
    color: #fff
}

.widget-config-panel .component-tab-navigator {
    height: 30px;
    background: #f8f8f8;
    border-bottom: 1px solid #dcdee3;
    cursor: pointer
}

.widget-config-panel .component-tab-navigator li {
    width: 45px;
    height: 29px;
    padding-top: 5px;
    text-align: center;
    border-top: 2px solid transparent;
    float: left;
    background: #f8f8f8
}

.widget-config-panel .component-tab-navigator li.active {
    border-top: 2px solid #00c1de;
    border-bottom: none;
    border-right: 1px solid #dcdee3;
    border-left: 1px solid #dcdee3;
    background-color: #fff;
    height: 30px
}

.widget-config-panel .component-tab-navigator li.active:first-child {
    border-left: none
}

.qbi-charts-senior.chart-relation {
    padding: 15px
}

.qbi-charts-senior.chart-relation .mgtb {
    margin-bottom: 10px
}

.qbi-charts-senior.chart-relation h3 {
    line-height: 30px
}

.qbi-charts-senior.chart-relation label {
    line-height: 15px
}

.qbi-charts-senior.chart-relation h3, .qbi-charts-senior.chart-relation label {
    height: 30px;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px;
    position: relative;
    cursor: pointer
}

.qbi-charts-senior.chart-relation h3 .iconfont, .qbi-charts-senior.chart-relation label .iconfont {
    position: absolute;
    right: 0;
    top: 0
}

.qbi-charts-senior.chart-relation label span {
    width: 80%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.qbi-charts-senior.chart-relation .column-list {
    background: #fff;
    padding: 0 6px
}

.qbi-charts-senior.chart-relation .column-list input[type=checkbox] {
    margin-right: 2px
}

.qbi-charts-senior.chart-relation .column-list > li.hover .tree-list {
    display: block
}

.qbi-charts-senior.chart-relation .column-list > li.hover i.icon-arrow-down-l:before {
    content: "\E63D"
}

.qbi-charts-senior.chart-relation .column-list .tree-list {
    max-height: 300px;
    overflow-y: auto
}

.qbi-charts-senior.chart-relation .column-list > li {
    border-bottom: 1px dashed #ccc
}

.qbi-charts-senior.chart-relation .column-list > li:last-child {
    border-bottom: 0 none
}

.qbi-charts-senior.chart-relation .column-list li li {
    padding-left: 20px;
    border-left: 1px dashed #ccc
}

.editarea {
    height: 100%;
    position: relative
}

.editarea.mobile-preview {
    width: 375px;
    height: 667px;
    margin: 20px auto;
    background-color: #fff;
    border: 1px solid #ccc
}

qbi-tab gridster {
    height: 100% !important
}

qbi-tab qbi-grid .editarea {
    background-image: none !important
}

gridster {
    position: relative;
    display: block;
    width: auto;
    z-index: 9;
    user-select: none;
    -webkit-user-select: none
}

qbi-tab gridster {
    height: 100%
}

gridster .editarea {
    z-index: 9
}

qbi-query-view {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow-y: auto;
    overflow-x: hidden
}

gridster-item .gridster-item-inner {
    display: block;
    height: calc(100% - 10px);
    position: absolute;
    border: 1px solid #f2f2f2
}

body:not(.viewmode) gridster-item.active .gridster-item-inner { /*border-color:#00c1de;box-shadow:0 3px 10px #99ecf9*/
}

body:not(.viewmode) gridster-item:not(.active) .gridster-item-inner {
    border-color: #f2f2f2
}

gridster-item.moving {
    opacity: .9
}

gridster-item.topPanel {
    z-index: 19
}

.viewmode gridster-item .resizeHandle {
    display: none
}

gridster-item .resizeHandle {
    position: absolute;
    display: none
}

body:not(.viewmode) gridster-item.active .resizeHandle {
    display: block
}

gridster-item .resizeHandle.resize-bottom-right {
    right: 0;
    bottom: 0;
    width: 16px;
    height: 10px;
    z-index: 2;
    cursor: se-resize !important
}

gridster-item .resizeHandle.resize-bottom-right:after {
    border-width: 0 4px 4px 0;
    border-style: solid;
    border-color: #999;
    position: relative;
    display: block;
    top: 0;
    left: 7px;
    content: "";
    width: 12px;
    height: 12px
}

.handle {
    width: 100%;
    height: 50px;
    background: blue
}

.qbi-component-title + .switchtainer {
    height: calc(100% - 20px)
}

.switchtainer {
    height: 100%;
    width: 100%;
    overflow: auto
}

.iframe .switchtainer {
    overflow: hidden
}

gridster .query .switchtainer {
    overflow: visible !important
}

.canvas-empty-tip {
    position: absolute;
    top: 100px;
    text-align: center;
    font-size: 40px;
    color: #c3c3c3;
    left: calc(50% - 200px)
}

.position-highlight {
    display: block;
    position: absolute;
    z-index: 1
}

.position-highlight .inner {
    position: absolute;
    background-color: rgba(0, 0, 0, .1)
}

.gridster-item-inner, .position-highlight .inner {
    position: absolute;
    top: 5px;
    bottom: 5px;
    left: 5px;
    right: 5px;
    border: 1px solid transparent;
    transition: background 3s
}

.mobile-preview .mat-sidenav-container, .mobile .mat-sidenav-container {
    background-color: #f8f8f8
}

.mobile-preview .grid, .mobile .grid {
    width: 100% !important;
    height: auto !important;
    padding: 10px
}

.mobile-preview .gridster-container, .mobile .gridster-container {
    margin: 0 auto
}

.mobile-preview .grid-item, .mobile .grid-item {
    position: static !important;
    width: 100% !important;
    padding: 0 !important
}

.mobile-preview .grid-item .gridster-item-inner, .mobile .grid-item .gridster-item-inner {
    position: static !important;
    border: none;
    box-shadow: none;
    margin-top: 5px;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, .07)
}

.mobile-preview gridster-item .gridster-item-inner, .mobile gridster-item .gridster-item-inner {
    height: 100%
}

.mobile-preview .qbi-component-title + .switchtainer, .mobile .qbi-component-title + .switchtainer {
    height: calc(100% - 36px)
}

.qbi-box .handsontable {
    position: relative
}

.qbi-box .handsontable .hide {
    display: none
}

.qbi-box .handsontable .relative {
    position: relative
}

.qbi-box .handsontable.htAutoSize {
    visibility: hidden;
    left: -99000px;
    position: absolute;
    top: -99000px
}

.qbi-box .handsontable .wtHider {
    width: 0
}

.qbi-box .handsontable .wtSpreader {
    position: relative;
    width: 0;
    height: auto
}

.qbi-box .handsontable div, .qbi-box .handsontable input, .qbi-box .handsontable table, .qbi-box .handsontable tbody, .qbi-box .handsontable td, .qbi-box .handsontable textarea, .qbi-box .handsontable th, .qbi-box .handsontable thead {
    box-sizing: content-box;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box
}

.qbi-box .handsontable input, .qbi-box .handsontable textarea {
    min-height: 0
}

.qbi-box .handsontable table.htCore {
    border-collapse: separate;
    border-spacing: 0;
    margin: 0;
    border-width: 0;
    table-layout: fixed;
    width: 0;
    outline-width: 0;
    max-width: none;
    max-height: none
}

.qbi-box .handsontable col, .qbi-box .handsontable col.rowHeader {
    width: 50px
}

.qbi-box .handsontable tr:last-child td {
    border-bottom: 1px solid #ccc
}

.qbi-box .handsontable td, .qbi-box .handsontable th {
    border-top-width: 0;
    border-left-width: 0;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    height: 22px;
    empty-cells: show;
    line-height: 21px;
    padding: 0 4px;
    background-color: #fff;
    vertical-align: top;
    overflow: hidden;
    outline-width: 0;
    white-space: pre-line;
    background-clip: padding-box
}

.qbi-box .handsontable td.htInvalid {
    background-color: #ff4c42 !important
}

.qbi-box .handsontable td.htNoWrap {
    white-space: nowrap
}

.qbi-box .handsontable th:last-child {
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc
}

.qbi-box .handsontable th.htNoFrame, .qbi-box .handsontable th:first-child.htNoFrame, .qbi-box .handsontable tr:first-child th.htNoFrame {
    border-left-width: 0;
    background-color: #fff;
    border-color: #fff
}

.qbi-box .handsontable .htNoFrame + td, .qbi-box .handsontable .htNoFrame + th, .qbi-box .handsontable.htRowHeaders thead tr th:nth-child(2), .qbi-box .handsontable td:first-of-type, .qbi-box .handsontable th:first-child, .qbi-box .handsontable th:nth-child(2) {
    border-left: 1px solid #ccc
}

.qbi-box .handsontable tr:first-child td, .qbi-box .handsontable tr:first-child th {
    border-top: 1px solid #ccc
}

.qbi-box .ht_master:not(.innerBorderLeft):not(.emptyColumns) ~ .handsontable:not(.ht_clone_top) thead tr th:first-child, .qbi-box .ht_master:not(.innerBorderLeft):not(.emptyColumns) ~ .handsontable tbody tr th {
    border-right-width: 0
}

.qbi-box .ht_master:not(.innerBorderTop) thead tr.lastChild th, .qbi-box .ht_master:not(.innerBorderTop) thead tr:last-child th, .qbi-box .ht_master:not(.innerBorderTop) ~ .handsontable thead tr.lastChild th, .qbi-box .ht_master:not(.innerBorderTop) ~ .handsontable thead tr:last-child th {
    border-bottom-width: 0
}

.qbi-box .handsontable th {
    background-color: #f3f3f3;
    color: #222;
    text-align: center;
    font-weight: 400;
    white-space: nowrap
}

.qbi-box .handsontable thead th {
    padding: 0
}

.qbi-box .handsontable th.active {
    background-color: #ccc
}

.qbi-box .handsontable thead th .relative {
    padding: 2px 4px
}

.qbi-box .handsontable tbody th.ht__highlight, .qbi-box .handsontable thead th.ht__highlight {
    background-color: #dcdcdc
}

.qbi-box .handsontable.ht__selection--columns thead th.ht__highlight, .qbi-box .handsontable.ht__selection--rows tbody th.ht__highlight {
    background-color: #8eb0e7;
    color: #000
}

.qbi-box .handsontable .manualColumnResizer {
    position: fixed;
    top: 0;
    cursor: col-resize;
    z-index: 110;
    width: 5px;
    height: 25px
}

.qbi-box .handsontable .manualRowResizer {
    position: fixed;
    left: 0;
    cursor: row-resize;
    z-index: 110;
    height: 5px;
    width: 50px
}

.qbi-box .handsontable .manualColumnResizer.active, .qbi-box .handsontable .manualColumnResizer:hover, .qbi-box .handsontable .manualRowResizer.active, .qbi-box .handsontable .manualRowResizer:hover {
    background-color: #aab
}

.qbi-box .handsontable .manualColumnResizerGuide {
    position: fixed;
    right: 0;
    top: 0;
    background-color: #aab;
    display: none;
    width: 0;
    border-right: 1px dashed #777;
    margin-left: 5px
}

.qbi-box .handsontable .manualRowResizerGuide {
    position: fixed;
    left: 0;
    bottom: 0;
    background-color: #aab;
    display: none;
    height: 0;
    border-bottom: 1px dashed #777;
    margin-top: 5px
}

.qbi-box .handsontable .manualColumnResizerGuide.active, .qbi-box .handsontable .manualRowResizerGuide.active {
    display: block;
    z-index: 199
}

.qbi-box .handsontable .columnSorting {
    position: relative
}

.qbi-box .handsontable .columnSorting:hover {
    text-decoration: underline;
    cursor: pointer
}

.qbi-box .handsontable .columnSorting.ascending:after {
    content: "\25B2";
    color: #5f5f5f;
    position: absolute;
    right: -15px
}

.qbi-box .handsontable .columnSorting.descending:after {
    content: "\25BC";
    color: #5f5f5f;
    position: absolute;
    right: -15px
}

.qbi-box .handsontable .wtBorder {
    position: absolute;
    font-size: 0
}

.qbi-box .handsontable .wtBorder.hidden {
    display: none !important
}

.qbi-box .handsontable td.area {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(181, 209, 255, .34)), color-stop(100%, rgba(181, 209, 255, .34)));
    background: -webkit-linear-gradient(top, rgba(181, 209, 255, .34), rgba(181, 209, 255, .34));
    background: linear-gradient(180deg, rgba(181, 209, 255, .34) 0, rgba(181, 209, 255, .34));
    background-color: #fff
}

.qbi-box .handsontable .wtBorder.corner {
    font-size: 0;
    cursor: crosshair
}

.qbi-box .handsontable .htBorder.htFillBorder {
    background: red;
    width: 1px;
    height: 1px
}

.qbi-box .handsontableInput {
    border: none;
    outline-width: 0;
    margin: 0;
    padding: 1px 5px 0;
    font-family: inherit;
    line-height: 21px;
    font-size: inherit;
    box-shadow: inset 0 0 0 2px #5292f7;
    resize: none;
    display: inline-block;
    color: #000;
    border-radius: 0;
    background-color: #fff
}

.qbi-box .handsontableInputHolder {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100
}

.qbi-box .htSelectEditor {
    -webkit-appearance: menulist-button !important;
    position: absolute;
    width: auto
}

.qbi-box .handsontable .htDimmed {
    color: #777
}

.qbi-box .handsontable .htSubmenu {
    position: relative
}

.qbi-box .handsontable .htSubmenu :after {
    content: "\25B6";
    color: #777;
    position: absolute;
    right: 5px
}

.qbi-box .handsontable .htLeft {
    text-align: left
}

.qbi-box .handsontable .htCenter {
    text-align: center
}

.qbi-box .handsontable .htRight {
    text-align: right
}

.qbi-box .handsontable .htJustify {
    text-align: justify
}

.qbi-box .handsontable .htTop {
    vertical-align: top
}

.qbi-box .handsontable .htMiddle {
    vertical-align: middle
}

.qbi-box .handsontable .htBottom {
    vertical-align: bottom
}

.qbi-box .handsontable .htPlaceholder {
    color: #999
}

.qbi-box .handsontable .htAutocompleteArrow {
    float: right;
    font-size: 10px;
    color: #eee;
    cursor: default;
    width: 16px;
    text-align: center
}

.qbi-box .handsontable td .htAutocompleteArrow:hover {
    color: #777
}

.qbi-box .handsontable td.area .htAutocompleteArrow {
    color: #d3d3d3
}

.qbi-box .handsontable .htCheckboxRendererInput {
    display: inline-block;
    vertical-align: middle
}

.qbi-box .handsontable .htCheckboxRendererInput.noValue {
    opacity: .5
}

.qbi-box .handsontable .htCheckboxRendererLabel {
    cursor: pointer;
    display: inline-block;
    width: 100%
}

@-webkit-keyframes opacity-hide {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes opacity-hide {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@-webkit-keyframes opacity-show {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes opacity-show {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.qbi-box .handsontable .handsontable.ht_clone_top .wtHider {
    padding: 0 0 5px
}

.qbi-box .handsontable .autocompleteEditor.handsontable {
    padding-right: 17px
}

.qbi-box .handsontable .autocompleteEditor.handsontable.htMacScroll {
    padding-right: 15px
}

.qbi-box .handsontable.listbox {
    margin: 0
}

.qbi-box .handsontable.listbox .ht_master table {
    border: 1px solid #ccc;
    border-collapse: separate;
    background: #fff
}

.qbi-box .handsontable.listbox td, .qbi-box .handsontable.listbox th, .qbi-box .handsontable.listbox tr:first-child td, .qbi-box .handsontable.listbox tr:first-child th, .qbi-box .handsontable.listbox tr:last-child th {
    border-color: transparent
}

.qbi-box .handsontable.listbox td, .qbi-box .handsontable.listbox th {
    white-space: nowrap;
    text-overflow: ellipsis
}

.qbi-box .handsontable.listbox td.htDimmed {
    cursor: default;
    color: inherit;
    font-style: inherit
}

.qbi-box .handsontable.listbox .wtBorder {
    visibility: hidden
}

.qbi-box .handsontable.listbox tr:hover td, .qbi-box .handsontable.listbox tr td.current {
    background: #eee
}

.qbi-box .ht_clone_top {
    z-index: 101
}

.qbi-box .ht_clone_left {
    z-index: 102
}

.qbi-box .ht_clone_bottom_left_corner, .qbi-box .ht_clone_debug, .qbi-box .ht_clone_top_left_corner {
    z-index: 103
}

.qbi-box .handsontable td.htSearchResult {
    background: #fcedd9;
    color: #583707
}

.qbi-box .htBordered {
    border-width: 1px
}

.qbi-box .htBordered.htTopBorderSolid {
    border-top-style: solid;
    border-top-color: #000
}

.qbi-box .htBordered.htRightBorderSolid {
    border-right-style: solid;
    border-right-color: #000
}

.qbi-box .htBordered.htBottomBorderSolid {
    border-bottom-style: solid;
    border-bottom-color: #000
}

.qbi-box .htBordered.htLeftBorderSolid {
    border-left-style: solid;
    border-left-color: #000
}

.qbi-box .handsontable tbody tr th:nth-last-child(2) {
    border-right: 1px solid #ccc
}

.qbi-box .handsontable thead tr:nth-last-child(2) th.htGroupIndicatorContainer {
    border-bottom: 1px solid #ccc;
    padding-bottom: 5px
}

.qbi-box .ht_clone_top_left_corner thead tr th:nth-last-child(2) {
    border-right: 1px solid #ccc
}

.qbi-box .htCollapseButton {
    width: 10px;
    height: 10px;
    line-height: 10px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid #f3f3f3;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, .4);
    cursor: pointer;
    margin-bottom: 3px;
    position: relative
}

.qbi-box .htCollapseButton:after {
    content: "";
    height: 300%;
    width: 1px;
    display: block;
    background: #ccc;
    margin-left: 4px;
    position: absolute;
    bottom: 10px
}

.qbi-box thead .htCollapseButton {
    right: 5px;
    position: absolute;
    top: 5px;
    background: #fff
}

.qbi-box thead .htCollapseButton:after {
    height: 1px;
    width: 700%;
    right: 10px;
    top: 4px
}

.qbi-box .handsontable tr th .htExpandButton {
    position: absolute;
    width: 10px;
    height: 10px;
    line-height: 10px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid #f3f3f3;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, .4);
    cursor: pointer;
    top: 0;
    display: none
}

.qbi-box .handsontable thead tr th .htExpandButton {
    top: 5px
}

.qbi-box .handsontable tr th .htExpandButton.clickable {
    display: block
}

.qbi-box .collapsibleIndicator {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 5px;
    border: 1px solid #a6a6a6;
    line-height: 10px;
    color: #222;
    border-radius: 10px;
    font-size: 10px;
    width: 10px;
    height: 10px;
    cursor: pointer;
    box-shadow: 0 0 0 6px #eee;
    background: #eee
}

.qbi-box .handsontable col.hidden {
    width: 0 !important
}

.qbi-box .handsontable table tr th.lightRightBorder {
    border-right: 1px solid #e6e6e6
}

.qbi-box .handsontable tr.hidden, .qbi-box .handsontable tr.hidden td, .qbi-box .handsontable tr.hidden th {
    display: none
}

.qbi-box .ht_clone_bottom, .qbi-box .ht_clone_left, .qbi-box .ht_clone_top, .qbi-box .ht_master {
    overflow: hidden
}

.qbi-box .ht_master .wtHolder {
    overflow: auto
}

.qbi-box .ht_clone_left .wtHolder {
    overflow-x: hidden;
    overflow-y: auto
}

.qbi-box .ht_clone_bottom .wtHolder, .qbi-box .ht_clone_top .wtHolder {
    overflow-x: auto;
    overflow-y: hidden
}

.qbi-box .wtDebugHidden {
    display: none
}

.qbi-box .wtDebugVisible {
    display: block;
    -webkit-animation-duration: .5s;
    -webkit-animation-name: wtFadeInFromNone;
    animation-duration: .5s;
    animation-name: wtFadeInFromNone
}

@keyframes wtFadeInFromNone {
    0% {
        display: none;
        opacity: 0
    }
    1% {
        display: block;
        opacity: 0
    }
    to {
        display: block;
        opacity: 1
    }
}

@-webkit-keyframes wtFadeInFromNone {
    0% {
        display: none;
        opacity: 0
    }
    1% {
        display: block;
        opacity: 0
    }
    to {
        display: block;
        opacity: 1
    }
}

.box-item .widget-chart-container {
    height: 100%;
    padding: 20px
}

.box-item .widget-chart-container.lbs-chart-container, .box-item .widget-chart-container.path-chart-container, .box-item .widget-chart-container.table-chart-container, .box-item .widget-chart-container.tree-chart-container, .box-item .widget-chart-container.wordCloud-chart-container {
    padding: 0
}

.box-item .widget-chart-container.indicator-chart-container .sc-config-setting {
    visibility: hidden
}

.box-item .widget-chart-container .widget-chart {
    width: 100%;
    height: 100%;
    z-index: 100;
    overflow: auto;
    min-height: 100px
}

.box-item .widget-chart-container .widget-chart .chart-tip {
    width: 100%;
    text-align: center;
    margin: 0 auto;
    font-size: 14px;
    margin-top: 20px
}

.box-item .widget-chart-container .widget-chart .J-sc-graph .leaflet-container {
    z-index: 100
}

.box-item .widget-chart-container .chart-error {
    padding: 20px;
    width: 100%;
    height: 100%;
    z-index: 101;
    overflow: auto;
    color: rgba(0, 0, 0, .9);
    font-size: 30px;
    top: 0;
    left: 0;
    line-height: 1;
    position: absolute;
    background: #fff;
    opacity: .7;
    vertical-align: middle
}

.box-item .widget-chart-container .chart-error .chart-title {
    height: 25px;
    font-size: 14px;
    line-height: 1.5
}

.box-item .widget-chart-container .chart-error .detail {
    text-align: center;
    font-size: inherit;
    margin-top: 80px
}

.box-item .widget-chart-container .queryerror {
    font-size: 14px;
    display: block;
    color: #000;
    text-align: left
}

.box-item .widget-chart-container.lbs-chart-container i.icon.edit {
    display: none
}

.box-item .widget-chart-container.lbs-chart-container .sc-bottom {
    position: absolute;
    left: 0;
    bottom: 20px;
    z-index: 1000
}

.box-item .indicator-chart-container .widget-chart {
    overflow-x: hidden
}

.box-item .no-border-table tr td {
    border: none !important
}

.box-item .icon-rise {
    color: #f15252
}

.box-item .icon-normal {
    color: #f8c32f
}

.box-item .icon-reduce {
    color: #43bb60
}

.normalbox {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 1px;
    min-width: 1px;
    cursor: pointer;
    z-index: 1;
    text-align: left;
    background-color: #fff
}

.normalbox:hover .qbi-box-more-oper {
    display: inline-block !important
}

.normalbox.hideTitle .chart-title, .normalbox.hideTitle .sc-title, .normalbox.hideTitle .table-title {
    visibility: hidden !important
}

.normalbox.path, .normalbox.table, .normalbox.tree, .normalbox.wordCloud {
    border: none;
    padding: 20px
}

.normalbox.path .table-title, .normalbox.table .table-title, .normalbox.tree .table-title, .normalbox.wordCloud .table-title {
    font-size: 14px;
    height: 25px
}

.normalbox.path .sc-title, .normalbox.table .sc-title, .normalbox.tree .sc-title, .normalbox.wordCloud .sc-title {
    display: none
}

.normalbox.path .switchtainer, .normalbox.table .switchtainer, .normalbox.tree .switchtainer, .normalbox.wordCloud .switchtainer {
    height: calc(100% - 25px)
}

.normalbox .qbi-component-title {
    height: 20px;
    line-height: 20px;
    background: #f9f9f9;
    padding: 0 4px
}

.normalbox .qbi-component-title .qbi-component-title-content {
    height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 30px;
    white-space: nowrap
}

.normalbox .cmd-area {
    position: absolute;
    top: 5px;
    right: 10px;
    z-index: 1000
}

.normalbox .cmd-area .iconfont {
    font-size: 16px;
    margin-left: 4px;
    cursor: pointer;
    color: #00c1de;
    opacity: .8
}

.normalbox .cmd-area .iconfont:hover {
    opacity: 1
}

.normalbox .cmd-area .icon-cancellink {
    font-size: 18px;
    margin-right: 10px
}

.normalbox .drill-title-content {
    position: absolute;
    width: 45px;
    top: 20px;
    right: 40px;
    overflow: visible;
    z-index: 102
}

.normalbox .drill-title-content .drill-level {
    position: relative;
    min-width: 90px
}

.normalbox .drill-title-content .drillup-list .kui-list-item {
    height: 26px;
    width: 90px;
    line-height: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.normalbox .drill-title-content .drillup-list .kui-list-item .drillup-text {
    transform: scale(.9);
    margin-left: -16px;
    margin-top: 2px;
    display: inline-block
}

.normalbox .drill-title-content .drillup-list .kui-list-item:last-child .drillup-text {
    color: #ccc
}

.qbi-box-more-oper {
    position: relative
}

.qbi-box-more-oper .kui-list {
    position: absolute;
    top: 10px;
    left: -80px;
    width: 100px;
    min-width: 100px
}

.qbi-box-more-oper .kui-list .iconfont, .qbi-box-more-oper .kui-list .nav-icon {
    margin-right: 10px
}

.line-scale {
    display: none
}

.qbi-loading .line-scale {
    display: block;
    z-index: 10000;
    position: absolute;
    top: 45%;
    left: 45%
}

.loader-mask {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #000;
    opacity: .4;
    z-index: 9999;
    display: none
}

.qbi-loading .loader-mask {
    display: block
}

.focus-container {
    width: 800px;
    height: 400px
}

.focus-container.mobile-container {
    width: 350px;
    height: 300px
}

@-webkit-keyframes line-scale {
    0% {
        -webkit-transform: scaley(1);
        transform: scaley(1)
    }
    50% {
        -webkit-transform: scaley(.4);
        transform: scaley(.4)
    }
    to {
        -webkit-transform: scaley(1);
        transform: scaley(1)
    }
}

@keyframes line-scale {
    0% {
        -webkit-transform: scaley(1);
        transform: scaley(1)
    }
    50% {
        -webkit-transform: scaley(.4);
        transform: scaley(.4)
    }
    to {
        -webkit-transform: scaley(1);
        transform: scaley(1)
    }
}

.line-scale > div:first-child {
    -webkit-animation: line-scale 1s .1s infinite cubic-bezier(.2, .68, .18, 1.08);
    animation: line-scale 1s .1s infinite cubic-bezier(.2, .68, .18, 1.08)
}

.line-scale > div:nth-child(2) {
    -webkit-animation: line-scale 1s .2s infinite cubic-bezier(.2, .68, .18, 1.08);
    animation: line-scale 1s .2s infinite cubic-bezier(.2, .68, .18, 1.08)
}

.line-scale > div:nth-child(3) {
    -webkit-animation: line-scale 1s .3s infinite cubic-bezier(.2, .68, .18, 1.08);
    animation: line-scale 1s .3s infinite cubic-bezier(.2, .68, .18, 1.08)
}

.line-scale > div:nth-child(4) {
    -webkit-animation: line-scale 1s .4s infinite cubic-bezier(.2, .68, .18, 1.08);
    animation: line-scale 1s .4s infinite cubic-bezier(.2, .68, .18, 1.08)
}

.line-scale > div:nth-child(5) {
    -webkit-animation: line-scale 1s .5s infinite cubic-bezier(.2, .68, .18, 1.08);
    animation: line-scale 1s .5s infinite cubic-bezier(.2, .68, .18, 1.08)
}

.line-scale > div {
    background-color: #fff;
    width: 4px;
    height: 35px;
    border-radius: 2px;
    margin: 2px;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    display: inline-block
}

.mobile-preview .normalbox .qbi-component-title, .mobile .normalbox .qbi-component-title {
    height: 36px;
    background: none
}

.mobile-preview .normalbox .qbi-component-title .qbi-component-title-content, .mobile .normalbox .qbi-component-title .qbi-component-title-content {
    font-size: 13px;
    height: 36px;
    padding: 8px 0
}

.mobile-preview .box-item .widget-chart-container .chart-error, .mobile .box-item .widget-chart-container .chart-error {
    height: calc(100% - 36px);
    top: 36px
}

.mobile-preview .cmd-area, .mobile .cmd-area {
    display: none
}

.drill-title-content {
    width: 100%;
    overflow: hidden
}

.drill-title-content .drill-title {
    width: 100%;
    height: 30px;
    line-height: 30px;
    overflow: hidden
}

.drill-title-content .drill-level em {
    font-style: normal
}

.drill-title-content .drill-level em.fliter-name {
    color: #56c8e2;
    cursor: pointer;
    margin-right: 5px
}

.drill-title-content .drill-level > span:last-child .fliter-name {
    color: #ccc
}

.drill-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url() 0 1px no-repeat;
    background-size: contain
}

.focus-mode .qbi-loading .loader-mask {
    top: 85px;
    height: 420px
}

.focus-mode .qbi-loading .line-scale {
    top: 52%
}

.focus-mode .qbi-loading .mobile-mask {
    top: 85px;
    height: 320px
}

.focus-container .J-drill-box {
    display: none
}

.focus-container .sc .sc-row {
    display: block;
    overflow: visible
}

.focus-container .sc-legend-icon {
    display: none
}

.focus-container .sc .sc-config {
    display: none !important
}

.focus-container .sc-popup .icon.edit:before, .focus-container .sc .icon.edit:before, .focus-container .sc .sc-axis-y .wm, .focus-container .sc.sc-config-show:hover .sc-config-setting, .focus-container .sc.sc-config-show:hover:after {
    display: none
}

.full-screen-box {
    background-color: transparent
}

.verticle-align-wrapper {
    width: 100%;
    max-height: 100%;
    overflow-y: auto
}

.widget-query-container {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 5px
}

.widget-query-container.isActive {
    background: #eee
}

.widget-query-container.isPreview .delete-field-bar {
    display: none !important
}

.widget-query-container.isPreview.isActive {
    background: transparent !important
}

.widget-query-container.isPreview.hide {
    display: none !important
}

.widget-query-container.isPreview .query-field-item.active, .widget-query-container.isPreview .query-field-item:hover {
    outline: none !important
}

.widget-query-container .query-field-area {
    flex: 1
}

.widget-query-container .query-field-area .ant-input {
    height: 24px !important
}

.widget-query-container .query-field-area .query-field-item {
    position: relative;
    display: inline-block;
    padding: 5px;
    margin: 2px;
    vertical-align: top
}

.widget-query-container .query-field-area .query-field-item a {
    text-decoration: none;
    background-color: transparent
}

.widget-query-container .query-field-area .query-field-item .input {
    height: 24px;
    border: 1px solid #ccc;
    padding: 4px 6px;
    border-radius: 2px;
    background-color: #fff;
    outline: 0
}

.widget-query-container .query-field-area .query-field-item .select {
    cursor: pointer;
    position: relative
}

.widget-query-container .query-field-area .query-field-item .query-field-label {
    line-height: 22px;
    color: #aaa
}

.widget-query-container .query-field-area .query-field-item .delete-field-bar {
    display: none;
    position: absolute;
    right: 5px;
    top: 6px
}

.widget-query-container .query-field-area .query-field-item .delete-field-bar:hover {
    color: #00c1de
}

.widget-query-container .query-field-area .query-field-item .delete-field-bar i {
    font-size: 16px
}

.widget-query-container .query-field-area .query-field-item.active {
    outline: 1px solid #00c1de
}

.widget-query-container .query-field-area .query-field-item.active .delete-field-bar {
    display: inline-block
}

.widget-query-container .query-field-area .query-field-item:hover {
    outline: 1px dashed #00c1de
}

.widget-query-container .query-field-area .query-field-item dl {
    padding-left: 5px;
    margin: 0;
    display: flex
}

.widget-query-container .query-field-area .query-field-item dl dt {
    line-height: 18px;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 10px;
    color: #666;
    width: 19%;
    margin-top: 4px
}

.widget-query-container .query-field-area .query-field-item dl dd {
    -webkit-margin-start: 10px;
    width: 78%
}

.widget-query-container .query-field-area .query-field-item .time-container .component-time {
    font-size: 12px;
    align-items: center
}

.widget-query-container .query-field-area .query-field-item .time-container .component-time input {
    line-height: normal
}

.widget-query-container .query-field-area .query-field-item .time-container .component-time .component-time-input {
    outline: none !important;
    padding: 4px 6px;
    height: 24px
}

.widget-query-container .query-field-area .query-field-item .time-container .component-time .component-split {
    margin: 0 3px;
    line-height: 22px
}

.widget-query-container .query-field-area .query-field-item .time-container .component-time .component-time-input[type=text] {
    min-width: 40px
}

.widget-query-container .query-field-area .query-field-item .input-group {
    display: -webkit-flex;
    display: flex;
    position: relative;
    border-collapse: separate
}

.widget-query-container .query-field-area .query-field-item .input-group .input[type=text] {
    flex: 1;
    background-color: transparent;
    width: 90px
}

.widget-query-container .query-field-area .query-field-item .select-condition {
    width: 76px
}

.widget-query-container .query-field-area .query-field-item .select-condition .dropdown-menu {
    top: 22px;
    left: -9px;
    text-align: left;
    min-width: 0;
    width: 83px
}

.widget-query-container .query-field-area .query-field-item .select-condition .dropdown-menu .item {
    padding: 8px 10px
}

.widget-query-container .query-field-area .query-field-item .input-group-addon {
    line-height: 21px;
    width: 76px;
    padding: 0;
    font-size: 12px;
    white-space: nowrap;
    vertical-align: middle;
    text-align: center;
    background-color: #f9f9f9;
    border: 1px solid #ccc;
    border-radius: 2px;
    flex: none
}

.widget-query-container .query-field-area .query-field-item .input-group-addon .widget-config-select {
    width: 75px;
    height: 22px;
    border: none;
    outline: none !important
}

.widget-query-container .query-field-area .query-field-item .input-group-addon:first-child {
    border-right: 0
}

.widget-query-container .query-field-area .query-field-item .orandlne {
    float: left;
    margin: 0 5px;
    line-height: 22px
}

.widget-query-container .query-field-area .query-field-item .mulity-condition .input-group {
    float: left
}

.widget-query-container .query-field-area .query-field-item .mulity-condition .input-group-addon {
    width: 76px
}

.widget-query-container .query-field-area .query-field-item .mulity-condition .condition-int, .widget-query-container .query-field-area .query-field-item .mulity-condition .condition-int-other {
    width: 90px !important
}

.widget-query-container .query-btn {
    width: 100px;
    text-align: center
}

.select-string-enumerate {
    width: 180px
}

.select-string-enumerate * {
    font-size: 12px
}

.select-string-enumerate .select {
    color: #999
}

.select-string-enumerate .select .input {
    height: 28px;
    border: 1px solid #ccc;
    padding: 4px 6px;
    border-radius: 2px;
    background-color: #fff;
    outline: 0
}

.select-string-enumerate .select .input .sel-value {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 95%
}

.select-string-enumerate .select .input i {
    position: absolute;
    right: 5px;
    top: 1px
}

.dropdown-list {
    position: relative;
    min-width: 360px;
    left: 0;
    padding: 0;
    width: 360px;
    max-width: 600px;
    border-top: none;
    min-height: 30px;
    font-size: 0;
    z-index: 1000;
    background-color: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    background-clip: padding-box;
    border: 1px solid #ccc
}

.dropdown-list.top {
    bottom: -2px
}

.dropdown-list.bottom {
    top: -2px
}

.dropdown-list .none {
    display: none
}

.dropdown-list .label {
    display: block;
    color: #666;
    margin-bottom: 10px
}

.dropdown-list.open {
    display: block
}

.dropdown-list .left-menu {
    font-size: 12px;
    vertical-align: top;
    padding: 5px;
    width: 50%;
    display: inline-block
}

.dropdown-list .left-menu.full-line {
    width: 100%
}

.dropdown-list .right-menu {
    font-size: 12px;
    vertical-align: top;
    padding: 5px;
    width: 50%;
    height: 320px;
    display: inline-block;
    background: #f0f2f5
}

.dropdown-list .right-menu .right-menu-title {
    height: 29px
}

.dropdown-list .right-menu .right-menu-title .title-left {
    font-size: 14px;
    float: left;
    line-height: 29px
}

.dropdown-list .right-menu .right-menu-title .title-right {
    cursor: pointer;
    float: right;
    line-height: 29px;
    color: #17b4d6
}

.dropdown-list .right-menu .right-menu-title .title-right i {
    font-size: 12px;
    margin-right: 5px
}

.dropdown-list .right-menu .empty-holder {
    height: 250px;
    line-height: 250px;
    text-align: center;
    clear: both
}

.dropdown-list .right-menu .text-area {
    height: 250px;
    position: relative
}

.dropdown-list .right-menu .text-area textarea {
    outline: none;
    padding: 5px 5px 28px;
    width: 100%;
    height: 250px;
    border: none;
    box-shadow: 0 2px 6px 0 rgba(130, 150, 183, .72)
}

.dropdown-list .right-menu .text-area .text-area-btn {
    position: absolute;
    width: 100%;
    text-align: center;
    background: #fff;
    bottom: -1px;
    padding-bottom: 4px
}

.dropdown-list .right-menu .text-area .text-area-btn button {
    width: 45%;
    padding: 4px 0
}

.dropdown-list .right-menu .right-menu-footer {
    height: 30px
}

.dropdown-list .right-menu .right-menu-footer .footer-left {
    float: left;
    line-height: 30px
}

.dropdown-list .right-menu .right-menu-footer .footer-right {
    cursor: pointer;
    float: right;
    line-height: 30px;
    color: #17b4d6
}

.dropdown-list .right-menu .right-menu-footer .footer-right i {
    font-size: 12px;
    margin-right: 5px
}

.dropdown-list .autochecker-filter {
    margin-bottom: 6px;
    width: 100%
}

.dropdown-list .autochecker-filter .filter-int {
    width: 100%
}

.dropdown-list .kui-mask-content {
    left: calc(50% - 55px) !important;
    top: calc(50% - 18px) !important
}

.dropdown-list .autochecker-list {
    border: none;
    width: 100%;
    height: 250px;
    overflow: hidden;
    overflow-y: auto;
    max-height: 500px
}

.dropdown-list .autochecker-list .item {
    position: relative;
    display: block;
    padding: 5px 20px 5px 0;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #333;
    white-space: nowrap;
    width: 100%
}

.dropdown-list .autochecker-list .item .isEdit {
    color: #17b4d6
}

.dropdown-list .autochecker-list .item .right-btn {
    position: absolute;
    display: none;
    width: 14px;
    height: 14px;
    line-height: 11px;
    top: 6px;
    right: 5px;
    font-size: 15px;
    color: #17b4d6;
    cursor: pointer
}

.dropdown-list .autochecker-list .item .right-btn.add-btn {
    background: #17b4d6;
    color: #fff;
    text-align: center;
    border-radius: 999px
}

.dropdown-list .autochecker-list .item.checked {
    background-color: #e3f4ff
}

.dropdown-list .autochecker-list .item:hover {
    color: #17b4d6;
    opacity: 1 !important
}

.dropdown-list .autochecker-list .item:hover .right-btn {
    display: block
}

.dropdown-list .autochecker-list .item .label {
    height: 30px;
    margin-bottom: 0;
    cursor: pointer
}

.dropdown-list .select-all label {
    display: flex;
    height: 30px;
    line-height: 30px;
    justify-content: flex-end;
    align-items: center;
    padding-right: 20px
}

.dropdown-list .select-all label i {
    right: 47px;
    left: auto
}

.qbi-query-container .autochecker-filter .filter-int {
    float: left;
    width: 100%
}

.qbi-query-container .autochecker-filter .filter-int:focus {
    color: #333;
    border-color: #00aafb;
    box-shadow: 0 0 2px 0 #00aafb
}

.qbi-query-container .autochecker-list {
    max-height: 300px;
    overflow: hidden;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #ccc;
    border-top: none;
    max-height: 150px
}

.qbi-query-container .autochecker-list .item {
    padding: 2px 10px;
    margin-bottom: 3px
}

.qbi-query-container .autochecker-list .item .label {
    margin-bottom: 0;
    cursor: pointer;
    display: block;
    color: #666;
    margin-bottom: 10px
}

.qbi-query-container .autochecker-list .item .label input {
    vertical-align: 1px
}

.qbi-query-container .autochecker-list .item .txt {
    display: inline-block;
    width: 85%;
    position: relative;
    top: 2px
}

.qbi-query-container .autochecker-list .item .txt, .qbi-query-container .no-wrap-div {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.qbi-query-container .config-section-row .field-relation {
    padding: 0 0 5px
}

.qbi-query-container .config-section-row .field-relation .form-icon {
    width: 1.3rem;
    height: 1.3rem
}

.qbi-query-container .config-section-row .field-relation .component-content, .qbi-query-container .config-section-row .field-relation .field-content {
    padding-left: 14px
}

.widget-query-selector-container .input {
    height: 28px;
    border: 1px solid #ccc;
    padding: 4px 6px;
    background-color: #fff
}

.widget-query-selector-container .input:focus {
    color: #333;
    border-color: #00aafb;
    box-shadow: 0 0 2px 0 #00aafb
}

.widget-query-selector-container .widget-config input[name=labelName] {
    width: calc(100% - 42px);
    margin-left: 5px
}

.widget-query-selector-container .widget-config-select {
    width: 188px;
    height: 28px;
    border: none;
    outline: 1px solid #ccc;
    background: #fff
}

.widget-query-selector-container .component-range-type, .widget-query-selector-container .component-time-type {
    display: flex;
    margin: 10px 0;
    border: 1px solid #00c1de;
    border-radius: 3px
}

.widget-query-selector-container .component-range-type li, .widget-query-selector-container .component-time-type li {
    flex: 1;
    text-align: center;
    border-right: 1px solid #00c1de;
    color: #00c1de;
    height: 24px;
    line-height: 24px;
    cursor: pointer
}

.widget-query-selector-container .component-range-type li:last-child, .widget-query-selector-container .component-time-type li:last-child {
    border-right: none
}

.widget-query-selector-container .component-range-type li.active, .widget-query-selector-container .component-time-type li.active {
    background: #00c1de;
    color: #fff
}

.widget-query-selector-container .component-time-config {
    color: #333
}

.widget-query-selector-container .component-time-config .time-shortcut li {
    float: left;
    height: 30px;
    line-height: 30px;
    color: #00c1de;
    width: 48%;
    border: 1px solid #00c1de;
    text-align: center;
    border-radius: 3px;
    margin-bottom: 10px;
    cursor: pointer
}

.widget-query-selector-container .component-time-config .time-shortcut li.active {
    color: #fff;
    background: #00c1de
}

.widget-query-selector-container .component-time-config .time-shortcut li:nth-child(2n) {
    margin-left: 4%
}

.widget-query-selector-container .component-time-config .time-tip {
    margin-bottom: 10px;
    display: -webkit-flex;
    display: flex;
    height: 30px;
    line-height: 30px;
    background-color: #f8f8f8;
    border: 1px solid #cbcbcb;
    padding: 0 5px
}

.widget-query-selector-container .component-time-config .time-tip select {
    background: #f8f8f8;
    width: 36px;
    margin: 0 3px;
    padding: 0;
    border: 0;
    outline: 0;
    height: 24px
}

.widget-query-selector-container .component-time-config .time-tip input[type=text] {
    text-align: right;
    height: 22px;
    line-height: 22px;
    width: 36px;
    border: 1px solid #ddd;
    padding: 4px 0
}

.widget-query-selector-container .component-time-config .time-tip input[type=text]:focus {
    color: #333;
    border-color: #00c1de;
    box-shadow: 0 0 2px 0 #00c1de
}

.widget-query-selector-container .component-time-config .time-tip .time-tip-item {
    flex: 2;
    display: -webkit-flex;
    display: flex;
    align-items: center
}

.widget-query-selector-container .component-time-config .time-tip .time-tip-item.hide {
    display: none !important
}

.widget-query-selector-container .component-time-config .time-tip .time-tip-item:last-child {
    justify-content: flex-end
}

.widget-query-selector-container .component-time-config .time-tip .time-tip-split {
    flex: .5;
    text-align: center
}

.widget-query-selector-container .component-time-config .time-tip .time-tip-split.hide {
    display: none
}

.widget-query-mobile-container {
    width: 100%;
    overflow-x: auto;
    white-space: nowrap;
    height: 100%;
    min-height: 42px;
    padding-top: 10px;
    position: relative;
    padding-left: 30px
}

.widget-query-mobile-container > div {
    display: inline-block
}

.widget-query-mobile-container .icon-block {
    padding: 0 5px;
    position: absolute;
    left: 0
}

.widget-query-mobile-container .icon-block span {
    font-size: 18px
}

.widget-query-mobile-container .condition-block {
    display: inline-block;
    border-right: 1px solid #dcdcdc;
    padding-right: 10px;
    margin-right: 10px
}

.widget-query-mobile-container .condition-block:last-child {
    border-right: none;
    margin-right: 0
}

.widget-query-mobile-container .condition-block * {
    font-size: 13px
}

.widget-query-mobile-container .condition-block .condition-label {
    color: #9b9b9b
}

.widget-query-mobile-container .condition-block .condition-block-cell {
    display: inline-block
}

.widget-query-mobile-container .condition-block .condition-block-cell .cell-operator {
    padding-right: 5px
}

.widget-query-mobile-container .condition-block .condition-block-cell .join-type {
    padding: 0 2px
}

.mobile-search-bar {
    display: flex;
    align-items: center;
    border-radius: 50vh;
    padding: 0 1.25rem;
    height: 2.25rem;
    background: rgba(0, 0, 0, .06)
}

.mobile-search-bar .btn-search {
    font-size: 1.3rem;
    font-weight: 700;
    color: #acacac;
    margin-right: .5rem
}

.mobile-search-bar .input-search {
    flex-grow: 1;
    height: 100%;
    background: transparent;
    border: 0;
    font-size: 1.16rem
}

.mobile-notify {
    position: fixed;
    z-index: 1010;
    width: 100%;
    bottom: 30px;
    text-align: center
}

.mobile-notify .mobile-notify-message .mobile-notify-message-content {
    display: inline-block;
    padding: 8px 25px;
    background-color: rgba(0, 0, 0, .5);
    color: #fff
}

.mobile-notify .mobile-notify-message + .mobile-notify-message {
    margin-top: 10px
}

.mobile-query-enum-modal-container.ant-modal-wrap .ant-modal-footer > button {
    color: #999
}

.mobile-query-enum-modal-container.ant-modal-wrap .ant-modal-footer > button.ant-btn-primary {
    background-color: #fff;
    color: #333;
    border-left: 1px solid rgba(0, 0, 0, .1)
}

mobile-query-enum-select .mat-select {
    display: block;
    border: 1px solid #d4d4d4;
    padding: 0 10px
}

mobile-query-enum-select [aria-disabled=true] .mat-select-underline {
    display: none
}

mobile-query-enum-select .mat-select-arrow, mobile-query-enum-select .mat-select-disabled .mat-select-value {
    color: rgba(0, 0, 0, .87)
}

button.mobile-common-button {
    height: 38px;
    border-radius: 0
}

button.mobile-common-button > i, button.mobile-common-button > span {
    font-size: 13px
}

.mobile-common-modal.ant-modal-wrap {
    display: flex;
    align-items: center
}

.mobile-common-modal.ant-modal-wrap .ant-modal-close .ant-modal-close-x {
    font-size: 18px
}

.mobile-common-modal.ant-modal-wrap .ant-modal {
    top: 0;
    padding: 0 10px;
    margin: 0 auto
}

.mobile-common-modal.ant-modal-wrap .ant-modal .ant-modal-content {
    border-radius: 0;
    background-clip: inherit
}

.mobile-common-modal.ant-modal-wrap .ant-modal .ant-modal-content .ant-modal-footer {
    display: flex;
    padding: 0
}

.mobile-common-modal.ant-modal-wrap .ant-modal-footer > button {
    flex-grow: 1;
    border: 0;
    border-radius: 0;
    height: 40px
}

.mobile-common-modal.ant-modal-wrap .ant-modal-footer > button > span {
    font-size: 16px
}

.mobile-query-enum-modal {
    position: relative;
    padding: 0 12px;
    width: 92vw;
    height: 75vh
}

.mobile-query-enum-modal .search-bar {
    padding: 10px 0
}

.mobile-query-enum-modal .select-item-list {
    height: calc(100% - 90px);
    overflow: auto
}

.mobile-query-enum-modal .select-item-list > ul {
    display: flex;
    flex-wrap: wrap
}

.mobile-query-enum-modal .select-item-list > ul > li {
    display: flex;
    margin: 3px;
    font-size: 13px;
    padding: 4px 6px;
    background: rgba(0, 0, 0, .06);
    color: rgba(0, 0, 0, .7);
    width: 30%;
    height: 44px;
    overflow-y: auto
}

.mobile-query-enum-modal .select-item-list > ul > li.selected {
    background: rgba(0, 193, 222, .16);
    color: #00c1de
}

.mobile-query-enum-modal .select-item-list > ul > li > span {
    margin: auto
}

.mobile-query-enum-modal .selected-container .select-item-list {
    min-height: 0;
    max-height: 65vh;
    padding-bottom: 10px
}

.mobile-query-enum-modal .selected-container {
    z-index: 11;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #f6f6f6;
    width: 100%;
    padding: 0 12px;
    border-top: 1px solid rgba(0, 0, 0, .1)
}

.mobile-query-enum-modal .selected-container .toggle-bar {
    color: #999;
    padding: 10px;
    text-align: center
}

.mobile-query-enum-modal .selected-container .toggle-bar > i {
    font-size: 14px
}

.mobile-query-enum-modal .selected-container .toggle-bar > span > b {
    color: #00c1de;
    font-weight: 400;
    margin: 0 2px
}

.mobile-query-enum-modal .selected-container .operator-bar {
    text-align: center;
    padding-bottom: 10px
}

.mobile-query-enum-modal .selected-container .operator-bar .btn-clear {
    width: 34%
}

.mobile-query-enum-modal .selected-container .operator-bar .btn-manual-input {
    width: 60%;
    margin-left: .6rem
}

.mobile-query-enum-modal .selected-container .operator-bar button > i {
    margin-right: .5rem
}

.manual-input-modal {
    padding: 10px;
    width: 93vw;
    height: 70vh
}

.manual-input-modal .manual-input-tips {
    font-size: 13px;
    padding-bottom: 10px
}

.manual-input-modal .manual-content {
    height: calc(100% - 30px)
}

.manual-input-modal .manual-content > textarea {
    border: 1px solid rgba(0, 0, 0, .1);
    width: 100%;
    height: 100%;
    padding: 5px 10px;
    font-size: 16px
}

.mobile-query-enum-modal-single .select-item-list {
    height: calc(100% - 50px)
}

.mobile-common-modal.ant-modal-wrap .ant-modal-content .ant-modal-body {
    padding: 0
}

.mulity-condition .mat-input-wrapper {
    padding-bottom: 18px
}

.sidenav-root {
    width: 100vw;
    height: 100%;
    background-color: #f8f8f8
}

.sidenav-root .title {
    position: relative;
    padding: 8px 0;
    text-align: center;
    background-color: #fff;
    background: #fff;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .1)
}

.sidenav-root .title .title-text {
    font-size: 16px;
    font-weight: 400
}

.sidenav-root .title .btn-close {
    position: absolute;
    right: 0;
    top: 0;
    padding: 12px;
    line-height: 14px
}

.sidenav-root .title .btn-close > span {
    font-size: 14px
}

.sidenav-root .sidenav-wraper {
    height: calc(100% - 80px);
    overflow: auto
}

.sidenav-root .sidenav-wraper .mat-input-underline {
    margin-top: 7px
}

.sidenav-root .sidenav-wraper .nav-condition {
    padding: 5px
}

.sidenav-root .sidenav-wraper .nav-condition + .nav-condition {
    border-top: 1px solid hsla(0, 0%, 59%, .16)
}

.sidenav-root .sidenav-wraper .nav-condition .query-name {
    height: 36px;
    display: block;
    padding-top: 8px;
    padding-left: 10px
}

.sidenav-root .sidenav-wraper .nav-condition .query-name .btn-clear {
    float: right;
    display: block;
    padding: 10px;
    margin-top: -10px;
    color: #62c1de
}

.sidenav-root .sidenav-wraper .nav-condition .query-content {
    padding: 0 10px;
    min-height: 40px
}

.sidenav-root .sidenav-wraper .week-spec {
    float: right;
    position: absolute
}

.sidenav-root .sidenav-bottom {
    height: 40px;
    cursor: pointer
}

.sidenav-root .sidenav-bottom .nbtn {
    width: 50%;
    float: left;
    height: 100%;
    text-align: center;
    padding-top: 8px;
    font-size: 18px;
    color: #fff;
    font-family: PingFangSC-Regular;
    cursor: pointer
}

.sidenav-root .sidenav-bottom .nav-reset {
    background: rgba(0, 193, 222, .16);
    color: #00c1de;
    border-top: 1px solid #00c1de
}

.sidenav-root .sidenav-bottom .nav-search {
    background-color: #00c1d3
}

.modal-grant-access .modal-pullable-body .defined-enddate-selector {
    width: 90px
}

.modal-grant-access .modal-pullable-body .ant-calendar-picker {
    margin-left: 7px;
    width: 100px
}

.modal-grant-access .modal-pullable-body .ng-invalid:not(form):focus, .modal-grant-access .modal-pullable-body form .ng-invalid:not(form) {
    border: none
}

.modal-grant-access .modal-pullable-body .shared-user-list .ant-tag-root {
    display: block
}

.modal-grant-access .modal-pullable-body .shared-user-list .ant-tag-root .ant-tag {
    width: 100%
}

.modal-grant-access .modal-pullable-body .shared-user-list .ant-tag-root .ant-tag .ant-tag-text {
    display: inline-block;
    width: calc(100% - 20px);
    line-height: 11px
}

.modal-grant-access .modal-pullable-body .shared-user-list .ant-tag-root .ant-tag .ant-tag-text > span {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis
}

.modal-grant-access .modal-pullable-body .shared-user-list .ant-tag-root .ant-tag .ant-tag-text > span.user-label {
    width: 70px
}

.modal-grant-access .modal-pullable-body .shared-user-list .ant-tag-root .ant-tag .ant-tag-text > span.expire-time {
    width: 210px;
    text-align: center
}

.modal-grant-access .modal-pullable-body .shared-user-list .ant-tag-root .ant-tag .ant-tag-text > span.expire-time > em {
    opacity: .4
}

.modal-grant-access .modal-pullable-body .normal-warning .notice {
    display: flex;
    padding: 10px
}

.modal-grant-access .modal-pullable-body .normal-warning .notice .flag {
    padding-right: 10px;
    vertical-align: middle;
    padding-top: 12px
}

.modal-grant-access .modal-pullable-body .normal-warning .notice .flag .iconfont {
    font-size: 30px
}

.modal-grant-access .modal-pullable-body .normal-warning .notice .words {
    -webkit-flex: 1;
    flex: 1
}

.modal-grant-access .modal-pullable-body .normal-warning .notice .words h3 {
    font-size: 14px;
    margin: 0 0 5px;
    font-weight: 400
}

.modal-grant-access .modal-pullable-body .normal-warning .notice .words p {
    margin: 0;
    color: #888
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-info {
    background: #e6f2f7;
    border: 1px solid #b5e2e8
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-info .flag {
    color: #289de9
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-info .flag > i {
    font-size: 30px;
    line-height: 20px
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-info .flag > .sicon:before {
    content: "\E6EA"
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-error {
    background: #feefea;
    border: 1px solid #f9ded6
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-error .flag {
    color: #f15e5e
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-error .flag > .sicon:before {
    content: "\E659"
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-big {
    padding: 20px
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-big .flag > .sicon {
    font-size: 48px
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-big .words h3 {
    font-size: 18px
}

.modal-grant-access .modal-pullable-body .normal-warning .notice.notice-big .words p {
    font-size: 14px
}

.mat-elevation-z0 {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, .2), 0 0 0 0 rgba(0, 0, 0, .14), 0 0 0 0 rgba(0, 0, 0, .12)
}

.mat-elevation-z1 {
    box-shadow: 0 2px 1px -1px rgba(0, 0, 0, .2), 0 1px 1px 0 rgba(0, 0, 0, .14), 0 1px 3px 0 rgba(0, 0, 0, .12)
}

.mat-elevation-z2 {
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12)
}

.mat-elevation-z3 {
    box-shadow: 0 3px 3px -2px rgba(0, 0, 0, .2), 0 3px 4px 0 rgba(0, 0, 0, .14), 0 1px 8px 0 rgba(0, 0, 0, .12)
}

.mat-elevation-z4 {
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12)
}

.mat-elevation-z5 {
    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 5px 8px 0 rgba(0, 0, 0, .14), 0 1px 14px 0 rgba(0, 0, 0, .12)
}

.mat-elevation-z6 {
    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12)
}

.mat-elevation-z7 {
    box-shadow: 0 4px 5px -2px rgba(0, 0, 0, .2), 0 7px 10px 1px rgba(0, 0, 0, .14), 0 2px 16px 1px rgba(0, 0, 0, .12)
}

.mat-elevation-z8 {
    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12)
}

.mat-elevation-z9 {
    box-shadow: 0 5px 6px -3px rgba(0, 0, 0, .2), 0 9px 12px 1px rgba(0, 0, 0, .14), 0 3px 16px 2px rgba(0, 0, 0, .12)
}

.mat-elevation-z10 {
    box-shadow: 0 6px 6px -3px rgba(0, 0, 0, .2), 0 10px 14px 1px rgba(0, 0, 0, .14), 0 4px 18px 3px rgba(0, 0, 0, .12)
}

.mat-elevation-z11 {
    box-shadow: 0 6px 7px -4px rgba(0, 0, 0, .2), 0 11px 15px 1px rgba(0, 0, 0, .14), 0 4px 20px 3px rgba(0, 0, 0, .12)
}

.mat-elevation-z12 {
    box-shadow: 0 7px 8px -4px rgba(0, 0, 0, .2), 0 12px 17px 2px rgba(0, 0, 0, .14), 0 5px 22px 4px rgba(0, 0, 0, .12)
}

.mat-elevation-z13 {
    box-shadow: 0 7px 8px -4px rgba(0, 0, 0, .2), 0 13px 19px 2px rgba(0, 0, 0, .14), 0 5px 24px 4px rgba(0, 0, 0, .12)
}

.mat-elevation-z14 {
    box-shadow: 0 7px 9px -4px rgba(0, 0, 0, .2), 0 14px 21px 2px rgba(0, 0, 0, .14), 0 5px 26px 4px rgba(0, 0, 0, .12)
}

.mat-elevation-z15 {
    box-shadow: 0 8px 9px -5px rgba(0, 0, 0, .2), 0 15px 22px 2px rgba(0, 0, 0, .14), 0 6px 28px 5px rgba(0, 0, 0, .12)
}

.mat-elevation-z16 {
    box-shadow: 0 8px 10px -5px rgba(0, 0, 0, .2), 0 16px 24px 2px rgba(0, 0, 0, .14), 0 6px 30px 5px rgba(0, 0, 0, .12)
}

.mat-elevation-z17 {
    box-shadow: 0 8px 11px -5px rgba(0, 0, 0, .2), 0 17px 26px 2px rgba(0, 0, 0, .14), 0 6px 32px 5px rgba(0, 0, 0, .12)
}

.mat-elevation-z18 {
    box-shadow: 0 9px 11px -5px rgba(0, 0, 0, .2), 0 18px 28px 2px rgba(0, 0, 0, .14), 0 7px 34px 6px rgba(0, 0, 0, .12)
}

.mat-elevation-z19 {
    box-shadow: 0 9px 12px -6px rgba(0, 0, 0, .2), 0 19px 29px 2px rgba(0, 0, 0, .14), 0 7px 36px 6px rgba(0, 0, 0, .12)
}

.mat-elevation-z20 {
    box-shadow: 0 10px 13px -6px rgba(0, 0, 0, .2), 0 20px 31px 3px rgba(0, 0, 0, .14), 0 8px 38px 7px rgba(0, 0, 0, .12)
}

.mat-elevation-z21 {
    box-shadow: 0 10px 13px -6px rgba(0, 0, 0, .2), 0 21px 33px 3px rgba(0, 0, 0, .14), 0 8px 40px 7px rgba(0, 0, 0, .12)
}

.mat-elevation-z22 {
    box-shadow: 0 10px 14px -6px rgba(0, 0, 0, .2), 0 22px 35px 3px rgba(0, 0, 0, .14), 0 8px 42px 7px rgba(0, 0, 0, .12)
}

.mat-elevation-z23 {
    box-shadow: 0 11px 14px -7px rgba(0, 0, 0, .2), 0 23px 36px 3px rgba(0, 0, 0, .14), 0 9px 44px 8px rgba(0, 0, 0, .12)
}

.mat-elevation-z24 {
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12)
}

.mat-ripple {
    overflow: hidden
}

.mat-ripple.mat-ripple-unbounded {
    overflow: visible
}

.mat-ripple-element {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    transition: opacity, transform 0s cubic-bezier(0, 0, .2, 1);
    transform: scale(0)
}

.mat-option {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    line-height: 48px;
    height: 48px;
    padding: 0 16px;
    font-size: 16px;
    font-family: Roboto, Helvetica Neue, sans-serif;
    text-align: left;
    text-decoration: none;
    position: relative;
    cursor: pointer;
    outline: 0
}

.mat-option[disabled] {
    cursor: default
}

[dir=rtl] .mat-option {
    text-align: right
}

.mat-option .mat-icon {
    margin-right: 16px
}

[dir=rtl] .mat-option .mat-icon {
    margin-left: 16px;
    margin-right: 0
}

.mat-option[aria-disabled=true] {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default
}

.mat-option-ripple {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    pointer-events: none
}

@media screen and (-ms-high-contrast: active) {
    .mat-option-ripple {
        opacity: .5
    }
}

.mat-option-pseudo-checkbox {
    margin-right: 8px
}

[dir=rtl] .mat-option-pseudo-checkbox {
    margin-left: 8px;
    margin-right: 0
}

.cdk-visually-hidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    text-transform: none;
    width: 1px
}

.cdk-global-overlay-wrapper, .cdk-overlay-container {
    pointer-events: none;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%
}

.cdk-overlay-container {
    position: fixed;
    z-index: 1000
}

.cdk-global-overlay-wrapper {
    display: flex;
    position: absolute;
    z-index: 1000
}

.cdk-overlay-pane {
    box-sizing: border-box
}

.cdk-overlay-backdrop, .cdk-overlay-pane {
    position: absolute;
    pointer-events: auto;
    z-index: 1000
}

.cdk-overlay-backdrop {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity .4s cubic-bezier(.25, .8, .25, 1);
    opacity: 0
}

.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
    opacity: .48
}

.cdk-overlay-dark-backdrop {
    background: rgba(0, 0, 0, .6)
}

.cdk-overlay-transparent-backdrop {
    background: 0 0
}

.cdk-global-scrollblock {
    position: fixed;
    width: 100%;
    overflow-y: scroll
}

.mat-ripple-element {
    background-color: rgba(0, 0, 0, .1)
}

.mat-option {
    color: rgba(0, 0, 0, .87)
}

.mat-option:focus:not(.mat-option-disabled), .mat-option:hover:not(.mat-option-disabled) {
    background: rgba(0, 0, 0, .04)
}

.mat-option.mat-selected.mat-primary, .mat-primary .mat-option.mat-selected {
    color: #3f51b5
}

.mat-accent .mat-option.mat-selected, .mat-option.mat-selected.mat-accent {
    color: #ff4081
}

.mat-option.mat-selected.mat-warn, .mat-warn .mat-option.mat-selected {
    color: #f44336
}

.mat-option.mat-active, .mat-option.mat-selected:not(.mat-option-multiple) {
    background: rgba(0, 0, 0, .04)
}

.mat-option.mat-active {
    color: rgba(0, 0, 0, .87)
}

.mat-option.mat-option-disabled {
    color: rgba(0, 0, 0, .38)
}

.mat-pseudo-checkbox {
    color: rgba(0, 0, 0, .54)
}

.mat-pseudo-checkbox:after {
    color: #fafafa
}

.mat-primary .mat-pseudo-checkbox-checked, .mat-primary .mat-pseudo-checkbox-indeterminate, .mat-pseudo-checkbox-checked.mat-primary, .mat-pseudo-checkbox-indeterminate.mat-primary {
    background: #3f51b5
}

.mat-accent .mat-pseudo-checkbox-checked, .mat-accent .mat-pseudo-checkbox-indeterminate, .mat-pseudo-checkbox-checked.mat-accent, .mat-pseudo-checkbox-indeterminate.mat-accent {
    background: #ff4081
}

.mat-pseudo-checkbox-checked.mat-warn, .mat-pseudo-checkbox-indeterminate.mat-warn, .mat-warn .mat-pseudo-checkbox-checked, .mat-warn .mat-pseudo-checkbox-indeterminate {
    background: #f44336
}

.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled {
    background: #b0b0b0
}

.mat-app-background {
    background-color: #fafafa
}

.mat-theme-loaded-marker {
    display: none
}

.mat-autocomplete-panel, .mat-autocomplete-panel .mat-option.mat-selected:not(.mat-active) {
    background: #fff;
    color: rgba(0, 0, 0, .87)
}

.mat-button, .mat-icon-button {
    background: 0 0
}

.mat-button.mat-primary .mat-button-focus-overlay, .mat-icon-button.mat-primary .mat-button-focus-overlay {
    background-color: rgba(63, 81, 181, .12)
}

.mat-button.mat-accent .mat-button-focus-overlay, .mat-icon-button.mat-accent .mat-button-focus-overlay {
    background-color: rgba(255, 64, 129, .12)
}

.mat-button.mat-warn .mat-button-focus-overlay, .mat-icon-button.mat-warn .mat-button-focus-overlay {
    background-color: rgba(244, 67, 54, .12)
}

.mat-button[disabled] .mat-button-focus-overlay, .mat-icon-button[disabled] .mat-button-focus-overlay {
    background-color: transparent
}

.mat-button.mat-primary, .mat-icon-button.mat-primary {
    color: #3f51b5
}

.mat-button.mat-accent, .mat-icon-button.mat-accent {
    color: #ff4081
}

.mat-button.mat-warn, .mat-icon-button.mat-warn {
    color: #f44336
}

.mat-button.mat-accent[disabled], .mat-button.mat-primary[disabled], .mat-button.mat-warn[disabled], .mat-button[disabled][disabled], .mat-icon-button.mat-accent[disabled], .mat-icon-button.mat-primary[disabled], .mat-icon-button.mat-warn[disabled], .mat-icon-button[disabled][disabled] {
    color: rgba(0, 0, 0, .38)
}

.mat-fab, .mat-mini-fab, .mat-raised-button {
    color: rgba(0, 0, 0, .87);
    background-color: #fff
}

.mat-fab.mat-primary, .mat-mini-fab.mat-primary, .mat-raised-button.mat-primary {
    color: hsla(0, 0%, 100%, .87)
}

.mat-fab.mat-accent, .mat-fab.mat-warn, .mat-mini-fab.mat-accent, .mat-mini-fab.mat-warn, .mat-raised-button.mat-accent, .mat-raised-button.mat-warn {
    color: #fff
}

.mat-fab.mat-accent[disabled], .mat-fab.mat-primary[disabled], .mat-fab.mat-warn[disabled], .mat-fab[disabled][disabled], .mat-mini-fab.mat-accent[disabled], .mat-mini-fab.mat-primary[disabled], .mat-mini-fab.mat-warn[disabled], .mat-mini-fab[disabled][disabled], .mat-raised-button.mat-accent[disabled], .mat-raised-button.mat-primary[disabled], .mat-raised-button.mat-warn[disabled], .mat-raised-button[disabled][disabled] {
    color: rgba(0, 0, 0, .38)
}

.mat-fab.mat-primary, .mat-mini-fab.mat-primary, .mat-raised-button.mat-primary {
    background-color: #3f51b5
}

.mat-fab.mat-accent, .mat-mini-fab.mat-accent, .mat-raised-button.mat-accent {
    background-color: #ff4081
}

.mat-fab.mat-warn, .mat-mini-fab.mat-warn, .mat-raised-button.mat-warn {
    background-color: #f44336
}

.mat-fab.mat-accent[disabled], .mat-fab.mat-primary[disabled], .mat-fab.mat-warn[disabled], .mat-fab[disabled][disabled], .mat-mini-fab.mat-accent[disabled], .mat-mini-fab.mat-primary[disabled], .mat-mini-fab.mat-warn[disabled], .mat-mini-fab[disabled][disabled], .mat-raised-button.mat-accent[disabled], .mat-raised-button.mat-primary[disabled], .mat-raised-button.mat-warn[disabled], .mat-raised-button[disabled][disabled] {
    background-color: rgba(0, 0, 0, .12)
}

.mat-fab.mat-accent .mat-ripple-element, .mat-fab.mat-primary .mat-ripple-element, .mat-fab.mat-warn .mat-ripple-element, .mat-mini-fab.mat-accent .mat-ripple-element, .mat-mini-fab.mat-primary .mat-ripple-element, .mat-mini-fab.mat-warn .mat-ripple-element, .mat-raised-button.mat-accent .mat-ripple-element, .mat-raised-button.mat-primary .mat-ripple-element, .mat-raised-button.mat-warn .mat-ripple-element {
    background-color: hsla(0, 0%, 100%, .2)
}

.mat-button.mat-primary .mat-ripple-element {
    background-color: rgba(63, 81, 181, .1)
}

.mat-button.mat-accent .mat-ripple-element {
    background-color: rgba(255, 64, 129, .1)
}

.mat-button.mat-warn .mat-ripple-element {
    background-color: rgba(244, 67, 54, .1)
}

.mat-icon-button.mat-primary .mat-ripple-element {
    background-color: rgba(63, 81, 181, .2)
}

.mat-icon-button.mat-accent .mat-ripple-element {
    background-color: rgba(255, 64, 129, .2)
}

.mat-icon-button.mat-warn .mat-ripple-element {
    background-color: rgba(244, 67, 54, .2)
}

.mat-fab, .mat-mini-fab {
    background-color: #ff4081;
    color: #fff
}

.mat-fab .mat-ripple-element, .mat-mini-fab .mat-ripple-element {
    background-color: hsla(0, 0%, 100%, .2)
}

.mat-button-toggle {
    color: rgba(0, 0, 0, .38)
}

.mat-button-toggle.cdk-focused .mat-button-toggle-focus-overlay {
    background-color: rgba(0, 0, 0, .06)
}

.mat-button-toggle-checked {
    background-color: #e0e0e0;
    color: #000
}

.mat-button-toggle-disabled {
    background-color: #eee;
    color: rgba(0, 0, 0, .38)
}

.mat-button-toggle-disabled.mat-button-toggle-checked {
    background-color: #bdbdbd
}

.mat-card {
    background: #fff;
    color: rgba(0, 0, 0, .87)
}

.mat-card-subtitle {
    color: rgba(0, 0, 0, .54)
}

.mat-checkbox-frame {
    border-color: rgba(0, 0, 0, .54)
}

.mat-checkbox-checkmark {
    fill: #fafafa
}

.mat-checkbox-checkmark-path {
    stroke: #fafafa !important
}

.mat-checkbox-mixedmark {
    background-color: #fafafa
}

.mat-checkbox-checked.mat-primary .mat-checkbox-background, .mat-checkbox-indeterminate.mat-primary .mat-checkbox-background {
    background-color: #3f51b5
}

.mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
    background-color: #ff4081
}

.mat-checkbox-checked.mat-warn .mat-checkbox-background, .mat-checkbox-indeterminate.mat-warn .mat-checkbox-background {
    background-color: #f44336
}

.mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
    background-color: #b0b0b0
}

.mat-checkbox-disabled:not(.mat-checkbox-checked) .mat-checkbox-frame {
    border-color: #b0b0b0
}

.mat-checkbox-disabled .mat-checkbox-label {
    color: #b0b0b0
}

.mat-checkbox:not(.mat-checkbox-disabled).mat-primary .mat-checkbox-ripple .mat-ripple-element {
    background-color: rgba(63, 81, 181, .26)
}

.mat-checkbox:not(.mat-checkbox-disabled).mat-accent .mat-checkbox-ripple .mat-ripple-element {
    background-color: rgba(255, 64, 129, .26)
}

.mat-checkbox:not(.mat-checkbox-disabled).mat-warn .mat-checkbox-ripple .mat-ripple-element {
    background-color: rgba(244, 67, 54, .26)
}

.mat-chip:not(.mat-basic-chip) {
    background-color: #e0e0e0;
    color: rgba(0, 0, 0, .87)
}

.mat-chip.mat-chip-selected:not(.mat-basic-chip) {
    background-color: grey;
    color: hsla(0, 0%, 100%, .87)
}

.mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary {
    background-color: #3f51b5;
    color: hsla(0, 0%, 100%, .87)
}

.mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent {
    background-color: #ff4081;
    color: #fff
}

.mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn {
    background-color: #f44336;
    color: #fff
}

.mat-datepicker-content {
    background-color: #fff
}

.mat-calendar-arrow {
    border-top-color: rgba(0, 0, 0, .54)
}

.mat-calendar-next-button, .mat-calendar-previous-button {
    color: rgba(0, 0, 0, .54)
}

.mat-calendar-table-header {
    color: rgba(0, 0, 0, .38)
}

.mat-calendar-table-header-divider:after {
    background: rgba(0, 0, 0, .12)
}

.mat-calendar-body-label {
    color: rgba(0, 0, 0, .54)
}

.mat-calendar-body-cell-content {
    color: rgba(0, 0, 0, .87);
    border-color: transparent
}

.mat-calendar-body-disabled > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
    color: rgba(0, 0, 0, .38)
}

.cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected), :not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
    background-color: rgba(0, 0, 0, .04)
}

.mat-calendar-body-selected {
    background-color: #3f51b5;
    color: hsla(0, 0%, 100%, .87)
}

.mat-calendar-body-disabled > .mat-calendar-body-selected {
    background-color: rgba(63, 81, 181, .4)
}

.mat-calendar-body-today:not(.mat-calendar-body-selected) {
    border-color: rgba(0, 0, 0, .38)
}

.mat-calendar-body-today.mat-calendar-body-selected {
    box-shadow: inset 0 0 0 1px hsla(0, 0%, 100%, .87)
}

.mat-calendar-body-disabled > .mat-calendar-body-today:not(.mat-calendar-body-selected) {
    border-color: rgba(0, 0, 0, .18)
}

.mat-dialog-container {
    background: #fff
}

.mat-icon.mat-primary {
    color: #3f51b5
}

.mat-icon.mat-accent {
    color: #ff4081
}

.mat-icon.mat-warn {
    color: #f44336
}

.mat-input-placeholder {
    color: rgba(0, 0, 0, .38)
}

.mat-focused .mat-input-placeholder {
    color: #3f51b5
}

.mat-focused .mat-input-placeholder.mat-accent {
    color: #ff4081
}

.mat-focused .mat-input-placeholder.mat-warn {
    color: #f44336
}

.mat-input-element:disabled {
    color: rgba(0, 0, 0, .38)
}

.mat-focused .mat-input-placeholder.mat-float .mat-placeholder-required, input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required {
    color: #ff4081
}

.mat-input-underline {
    border-color: rgba(0, 0, 0, .12)
}

.mat-input-underline .mat-input-ripple {
    background-color: #3f51b5
}

.mat-input-underline .mat-input-ripple.mat-accent {
    background-color: #ff4081
}

.mat-input-underline .mat-input-ripple.mat-warn {
    background-color: #f44336
}

.mat-input-invalid .mat-input-placeholder, .mat-input-invalid .mat-placeholder-required {
    color: #f44336
}

.mat-input-invalid .mat-input-ripple {
    background-color: #f44336
}

.mat-input-error {
    color: #f44336
}

.mat-list .mat-list-item, .mat-nav-list .mat-list-item {
    color: rgba(0, 0, 0, .87)
}

.mat-list .mat-subheader, .mat-nav-list .mat-subheader {
    color: rgba(0, 0, 0, .54)
}

.mat-divider {
    border-top-color: rgba(0, 0, 0, .12)
}

.mat-nav-list .mat-list-item {
    outline: 0
}

.mat-nav-list .mat-list-item.mat-list-item-focus, .mat-nav-list .mat-list-item:hover {
    background: rgba(0, 0, 0, .04)
}

.mat-menu-content {
    background: #fff
}

.mat-menu-item {
    background: 0 0;
    color: rgba(0, 0, 0, .87)
}

.mat-menu-item[disabled] {
    color: rgba(0, 0, 0, .38)
}

.mat-menu-item .mat-icon {
    color: rgba(0, 0, 0, .54);
    vertical-align: middle
}

.mat-menu-item:focus:not([disabled]), .mat-menu-item:hover:not([disabled]) {
    background: rgba(0, 0, 0, .04)
}

.mat-progress-bar-background {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20version%3D%271.1%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20xmlns%3Axlink%3D%27http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%27%20x%3D%270px%27%20y%3D%270px%27%20enable-background%3D%27new%200%200%205%202%27%20xml%3Aspace%3D%27preserve%27%20viewBox%3D%270%200%205%202%27%20preserveAspectRatio%3D%27none%20slice%27%3E%3Ccircle%20cx%3D%271%27%20cy%3D%271%27%20r%3D%271%27%20fill%3D%27%23c5cae9%27%2F%3E%3C%2Fsvg%3E")
}

.mat-progress-bar-buffer {
    background-color: #c5cae9
}

.mat-progress-bar-fill:after {
    background-color: #3f51b5
}

.mat-progress-bar.mat-accent .mat-progress-bar-background {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20version%3D%271.1%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20xmlns%3Axlink%3D%27http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%27%20x%3D%270px%27%20y%3D%270px%27%20enable-background%3D%27new%200%200%205%202%27%20xml%3Aspace%3D%27preserve%27%20viewBox%3D%270%200%205%202%27%20preserveAspectRatio%3D%27none%20slice%27%3E%3Ccircle%20cx%3D%271%27%20cy%3D%271%27%20r%3D%271%27%20fill%3D%27%23ff80ab%27%2F%3E%3C%2Fsvg%3E")
}

.mat-progress-bar.mat-accent .mat-progress-bar-buffer {
    background-color: #ff80ab
}

.mat-progress-bar.mat-accent .mat-progress-bar-fill:after {
    background-color: #ff4081
}

.mat-progress-bar.mat-warn .mat-progress-bar-background {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20version%3D%271.1%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20xmlns%3Axlink%3D%27http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%27%20x%3D%270px%27%20y%3D%270px%27%20enable-background%3D%27new%200%200%205%202%27%20xml%3Aspace%3D%27preserve%27%20viewBox%3D%270%200%205%202%27%20preserveAspectRatio%3D%27none%20slice%27%3E%3Ccircle%20cx%3D%271%27%20cy%3D%271%27%20r%3D%271%27%20fill%3D%27%23ffcdd2%27%2F%3E%3C%2Fsvg%3E")
}

.mat-progress-bar.mat-warn .mat-progress-bar-buffer {
    background-color: #ffcdd2
}

.mat-progress-bar.mat-warn .mat-progress-bar-fill:after {
    background-color: #f44336
}

.mat-progress-spinner path, .mat-spinner path {
    stroke: #3f51b5
}

.mat-progress-spinner.mat-accent path, .mat-spinner.mat-accent path {
    stroke: #ff4081
}

.mat-progress-spinner.mat-warn path, .mat-spinner.mat-warn path {
    stroke: #f44336
}

.mat-radio-outer-circle {
    border-color: rgba(0, 0, 0, .54)
}

.mat-radio-checked .mat-radio-outer-circle {
    border-color: #ff4081
}

.mat-radio-disabled .mat-radio-outer-circle {
    border-color: rgba(0, 0, 0, .38)
}

.mat-radio-inner-circle {
    background-color: #ff4081
}

.mat-radio-ripple .mat-ripple-element {
    background-color: rgba(255, 64, 129, .26)
}

.mat-radio-disabled .mat-radio-inner-circle, .mat-radio-disabled .mat-radio-ripple .mat-ripple-element {
    background-color: rgba(0, 0, 0, .38)
}

.mat-radio-disabled .mat-radio-label-content, .mat-select-arrow, .mat-select-trigger {
    color: rgba(0, 0, 0, .38)
}

.mat-select-underline {
    background-color: rgba(0, 0, 0, .12)
}

.mat-select-arrow, .mat-select-disabled .mat-select-value, .mat-select-trigger {
    color: rgba(0, 0, 0, .38)
}

.mat-select-content, .mat-select-panel-done-animating {
    background: #fff
}

.mat-select-value {
    color: rgba(0, 0, 0, .87)
}

.mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-arrow, .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-trigger {
    color: #3f51b5
}

.mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-underline {
    background-color: #3f51b5
}

.mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-arrow, .mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-trigger {
    color: #ff4081
}

.mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-underline {
    background-color: #ff4081
}

.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow, .mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger {
    color: #f44336
}

.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, .mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline {
    background-color: #f44336
}

.mat-sidenav-container {
    background-color: #fafafa;
    color: rgba(0, 0, 0, .87)
}

.mat-sidenav {
    color: rgba(0, 0, 0, .87)
}

.mat-sidenav, .mat-sidenav.mat-sidenav-push {
    background-color: #fff
}

.mat-sidenav-backdrop.mat-sidenav-shown {
    background-color: rgba(0, 0, 0, .6)
}

.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
    background-color: #e91e63
}

.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
    background-color: rgba(233, 30, 99, .5)
}

.mat-slide-toggle:not(.mat-checked) .mat-ripple-element {
    background-color: rgba(0, 0, 0, .06)
}

.mat-slide-toggle .mat-ripple-element {
    background-color: rgba(233, 30, 99, .12)
}

.mat-slide-toggle.mat-primary.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
    background-color: #3f51b5
}

.mat-slide-toggle.mat-primary.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
    background-color: rgba(63, 81, 181, .5)
}

.mat-slide-toggle.mat-primary:not(.mat-checked) .mat-ripple-element {
    background-color: rgba(0, 0, 0, .06)
}

.mat-slide-toggle.mat-primary .mat-ripple-element {
    background-color: rgba(63, 81, 181, .12)
}

.mat-slide-toggle.mat-warn.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
    background-color: #f44336
}

.mat-slide-toggle.mat-warn.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
    background-color: rgba(244, 67, 54, .5)
}

.mat-slide-toggle.mat-warn:not(.mat-checked) .mat-ripple-element {
    background-color: rgba(0, 0, 0, .06)
}

.mat-slide-toggle.mat-warn .mat-ripple-element {
    background-color: rgba(244, 67, 54, .12)
}

.mat-disabled .mat-slide-toggle-thumb {
    background-color: #bdbdbd
}

.mat-disabled .mat-slide-toggle-bar {
    background-color: rgba(0, 0, 0, .1)
}

.mat-slide-toggle-thumb {
    background-color: #fafafa
}

.mat-slide-toggle-bar {
    background-color: rgba(0, 0, 0, .38)
}

.mat-slider-track-background {
    background-color: rgba(0, 0, 0, .26)
}

.mat-primary .mat-slider-thumb, .mat-primary .mat-slider-thumb-label, .mat-primary .mat-slider-track-fill {
    background-color: #3f51b5
}

.mat-primary .mat-slider-thumb-label-text {
    color: hsla(0, 0%, 100%, .87)
}

.mat-accent .mat-slider-thumb, .mat-accent .mat-slider-thumb-label, .mat-accent .mat-slider-track-fill {
    background-color: #ff4081
}

.mat-accent .mat-slider-thumb-label-text {
    color: #fff
}

.mat-warn .mat-slider-thumb, .mat-warn .mat-slider-thumb-label, .mat-warn .mat-slider-track-fill {
    background-color: #f44336
}

.mat-warn .mat-slider-thumb-label-text {
    color: #fff
}

.mat-slider-focus-ring {
    background-color: rgba(255, 64, 129, .2)
}

.cdk-focused .mat-slider-track-background, .mat-slider:hover .mat-slider-track-background {
    background-color: rgba(0, 0, 0, .38)
}

.mat-slider-disabled .mat-slider-thumb, .mat-slider-disabled .mat-slider-track-background, .mat-slider-disabled .mat-slider-track-fill, .mat-slider-disabled:hover .mat-slider-track-background {
    background-color: rgba(0, 0, 0, .26)
}

.mat-slider-min-value .mat-slider-focus-ring {
    background-color: rgba(0, 0, 0, .12)
}

.mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label {
    background-color: #000
}

.mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb-label {
    background-color: rgba(0, 0, 0, .26)
}

.mat-slider-min-value:not(.mat-slider-thumb-label-showing) .mat-slider-thumb {
    border-color: rgba(0, 0, 0, .26);
    background-color: transparent
}

.mat-slider-min-value:not(.mat-slider-thumb-label-showing).cdk-focused .mat-slider-thumb, .mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover .mat-slider-thumb {
    border-color: rgba(0, 0, 0, .38)
}

.mat-slider-min-value:not(.mat-slider-thumb-label-showing).cdk-focused.mat-slider-disabled .mat-slider-thumb, .mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover.mat-slider-disabled .mat-slider-thumb {
    border-color: rgba(0, 0, 0, .26)
}

.mat-slider-has-ticks .mat-slider-wrapper:after {
    border-color: rgba(0, 0, 0, .7)
}

.mat-slider-horizontal .mat-slider-ticks {
    background-image: repeating-linear-gradient(90deg, rgba(0, 0, 0, .7), rgba(0, 0, 0, .7) 2px, transparent 0, transparent);
    background-image: -moz-repeating-linear-gradient(.0001deg, rgba(0, 0, 0, .7), rgba(0, 0, 0, .7) 2px, transparent 0, transparent)
}

.mat-slider-vertical .mat-slider-ticks {
    background-image: repeating-linear-gradient(180deg, rgba(0, 0, 0, .7), rgba(0, 0, 0, .7) 2px, transparent 0, transparent)
}

.mat-tab-header, .mat-tab-nav-bar {
    border-bottom: 1px solid rgba(0, 0, 0, .12)
}

.mat-tab-group-inverted-header .mat-tab-header, .mat-tab-group-inverted-header .mat-tab-nav-bar {
    border-top: 1px solid rgba(0, 0, 0, .12);
    border-bottom: none
}

.mat-tab-label:focus {
    background-color: rgba(197, 202, 233, .3)
}

.mat-ink-bar {
    background-color: #3f51b5
}

.mat-tab-label, .mat-tab-link {
    color: rgba(0, 0, 0, .87)
}

.mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled {
    color: rgba(0, 0, 0, .38)
}

.mat-toolbar {
    background: #f5f5f5;
    color: rgba(0, 0, 0, .87)
}

.mat-toolbar.mat-primary {
    background: #3f51b5;
    color: hsla(0, 0%, 100%, .87)
}

.mat-toolbar.mat-accent {
    background: #ff4081;
    color: #fff
}

.mat-toolbar.mat-warn {
    background: #f44336;
    color: #fff
}

.mat-tooltip {
    background: rgba(97, 97, 97, .9)
}

.mce-container, .mce-container *, .mce-reset, .mce-widget, .mce-widget * {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: top;
    background: transparent;
    text-decoration: none;
    color: #333;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 14px;
    text-shadow: none;
    float: none;
    position: static;
    width: auto;
    height: auto;
    white-space: nowrap;
    cursor: inherit;
    -webkit-tap-highlight-color: transparent;
    line-height: normal;
    font-weight: 400;
    text-align: left;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    direction: ltr;
    max-width: none
}

.mce-widget button {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.mce-container [unselectable] {
    -moz-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none
}

.mce-fade {
    opacity: 0;
    -webkit-transition: opacity .15s linear;
    transition: opacity .15s linear
}

.mce-fade.mce-in {
    opacity: 1
}

.mce-tinymce {
    visibility: inherit !important;
    position: relative
}

.mce-fullscreen {
    z-index: 100
}

div.mce-fullscreen {
    width: 100%;
    height: auto
}

.mce-tinymce {
    display: block
}

.mce-wordcount {
    position: absolute;
    top: 0;
    right: 0;
    padding: 8px
}

div.mce-edit-area {
    background: #fff;
    filter: none
}

.mce-statusbar, .mce-statusbar .mce-container-body {
    position: relative
}

.mce-fullscreen .mce-resizehandle {
    display: none
}

.mce-charmap {
    border-collapse: collapse
}

.mce-charmap td {
    cursor: default;
    border: 1px solid rgba(0, 0, 0, .2);
    width: 20px;
    height: 20px;
    line-height: 20px;
    vertical-align: middle;
    padding: 2px
}

.mce-charmap td, .mce-charmap td div {
    text-align: center
}

.mce-charmap td:hover {
    background: #d9d9d9
}

.mce-grid td.mce-grid-cell div {
    border: 1px solid #d6d6d6;
    width: 15px;
    height: 15px;
    margin: 0;
    cursor: pointer
}

.mce-grid td.mce-grid-cell div:focus {
    border-color: #3498db
}

.mce-grid td.mce-grid-cell div[disabled] {
    cursor: not-allowed
}

.mce-grid {
    border-spacing: 2px;
    border-collapse: separate
}

.mce-grid a {
    display: block;
    border: 1px solid transparent
}

.mce-grid a:focus, .mce-grid a:hover {
    border-color: #3498db
}

.mce-grid-border {
    margin: 0 4px
}

.mce-grid-border a {
    border-color: #d6d6d6;
    width: 13px;
    height: 13px
}

.mce-grid-border a.mce-active, .mce-grid-border a:hover {
    border-color: #3498db;
    background: #3498db
}

.mce-text-center {
    text-align: center
}

div.mce-tinymce-inline {
    width: 100%
}

.mce-colorbtn-trans div {
    text-align: center;
    vertical-align: middle;
    font-weight: 700;
    font-size: 20px;
    line-height: 16px;
    color: #707070
}

.mce-monospace {
    font-family: Courier New, Courier, monospace
}

.mce-toolbar-grp {
    padding: 2px 0
}

.mce-toolbar-grp .mce-flow-layout-item {
    margin-bottom: 0
}

.mce-rtl .mce-wordcount {
    left: 0;
    right: auto
}

.mce-croprect-container, .mce-croprect-handle {
    position: absolute;
    top: 0;
    left: 0
}

.mce-croprect-handle {
    width: 20px;
    height: 20px;
    border: 2px solid #fff
}

.mce-croprect-handle-nw {
    border-width: 2px 0 0 2px;
    margin: -2px 0 0 -2px;
    cursor: nw-resize;
    top: 100px;
    left: 100px
}

.mce-croprect-handle-ne {
    border-width: 2px 2px 0 0;
    margin: -2px 0 0 -20px;
    cursor: ne-resize;
    top: 100px;
    left: 200px
}

.mce-croprect-handle-sw {
    border-width: 0 0 2px 2px;
    margin: -20px 2px 0 -2px;
    cursor: sw-resize;
    top: 200px;
    left: 100px
}

.mce-croprect-handle-se {
    border-width: 0 2px 2px 0;
    margin: -20px 0 0 -20px;
    cursor: se-resize;
    top: 200px;
    left: 200px
}

.mce-croprect-handle-move {
    position: absolute;
    cursor: move;
    border: 0
}

.mce-croprect-block {
    opacity: .3;
    filter: alpha(opacity=30);
    zoom: 1;
    position: absolute;
    background: #000
}

.mce-croprect-handle:focus {
    border-color: #3498db
}

.mce-croprect-handle-move:focus {
    outline: 1px solid #3498db
}

.mce-imagepanel {
    overflow: auto;
    background: #000
}

.mce-imagepanel-bg {
    position: absolute;
    background: url("")
}

.mce-imagepanel img {
    position: absolute
}

.mce-imagetool.mce-btn .mce-ico {
    display: block;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    font-size: 20px;
    padding: 5px
}

.mce-arrow-up {
    margin-top: 12px
}

.mce-arrow-down {
    margin-top: -12px
}

.mce-arrow:after, .mce-arrow:before {
    position: absolute;
    left: 50%;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent;
    content: ""
}

.mce-arrow.mce-arrow-up:before {
    top: -9px;
    border-bottom-color: rgba(0, 0, 0, .2);
    border-width: 0 9px 9px;
    margin-left: -9px
}

.mce-arrow.mce-arrow-down:before {
    bottom: -9px;
    border-top-color: rgba(0, 0, 0, .2);
    border-width: 9px 9px 0;
    margin-left: -9px
}

.mce-arrow.mce-arrow-up:after {
    top: -8px;
    border-bottom-color: #f0f0f0;
    border-width: 0 8px 8px;
    margin-left: -8px
}

.mce-arrow.mce-arrow-down:after {
    bottom: -8px;
    border-top-color: #f0f0f0;
    border-width: 8px 8px 0;
    margin-left: -8px
}

.mce-arrow.mce-arrow-left:after, .mce-arrow.mce-arrow-left:before {
    margin: 0
}

.mce-arrow.mce-arrow-left:before {
    left: 8px
}

.mce-arrow.mce-arrow-left:after {
    left: 9px
}

.mce-arrow.mce-arrow-right:after, .mce-arrow.mce-arrow-right:before {
    left: auto;
    margin: 0
}

.mce-arrow.mce-arrow-right:before {
    right: 8px
}

.mce-arrow.mce-arrow-right:after {
    right: 9px
}

.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-left:before {
    left: -9px;
    top: 50%;
    border-right-color: rgba(0, 0, 0, .2);
    border-width: 9px 9px 9px 0;
    margin-top: -9px
}

.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-left:after {
    left: -8px;
    top: 50%;
    border-right-color: #f0f0f0;
    border-width: 8px 8px 8px 0;
    margin-top: -8px
}

.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-left {
    margin-left: 12px
}

.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-right:before {
    right: -9px;
    top: 50%;
    border-left-color: rgba(0, 0, 0, .2);
    border-width: 9px 0 9px 9px;
    margin-top: -9px
}

.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-right:after {
    right: -8px;
    top: 50%;
    border-left-color: #f0f0f0;
    border-width: 8px 0 8px 8px;
    margin-top: -8px
}

.mce-arrow.mce-arrow-center.mce-arrow.mce-arrow-right {
    margin-left: -14px
}

.mce-edit-aria-container > .mce-container-body {
    display: flex
}

.mce-edit-aria-container > .mce-container-body .mce-edit-area {
    flex: 1
}

.mce-edit-aria-container > .mce-container-body .mce-sidebar > .mce-container-body {
    display: flex;
    align-items: stretch;
    height: 100%
}

.mce-edit-aria-container > .mce-container-body .mce-sidebar-panel {
    min-width: 250px;
    max-width: 250px;
    position: relative
}

.mce-edit-aria-container > .mce-container-body .mce-sidebar-panel > .mce-container-body {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: auto;
    top: 0;
    left: 0
}

.mce-sidebar-toolbar {
    border: 0 solid rgba(0, 0, 0, .2);
    border-left-width: 1px
}

.mce-sidebar-toolbar .mce-btn.mce-active, .mce-sidebar-toolbar .mce-btn.mce-active:hover {
    border: 1px solid transparent;
    border-color: transparent;
    background-color: #2d8ac7
}

.mce-sidebar-toolbar .mce-btn.mce-active:hover button, .mce-sidebar-toolbar .mce-btn.mce-active:hover button i, .mce-sidebar-toolbar .mce-btn.mce-active button, .mce-sidebar-toolbar .mce-btn.mce-active button i {
    color: #fff;
    text-shadow: 1px 1px none
}

.mce-sidebar-panel {
    border: 0 solid rgba(0, 0, 0, .2);
    border-left-width: 1px
}

.mce-container, .mce-container-body {
    display: block
}

.mce-autoscroll {
    overflow: hidden
}

.mce-scrollbar {
    position: absolute;
    width: 7px;
    height: 100%;
    top: 2px;
    right: 2px;
    opacity: .4;
    filter: alpha(opacity=40);
    zoom: 1
}

.mce-scrollbar-h {
    top: auto;
    right: auto;
    left: 2px;
    bottom: 2px;
    width: 100%;
    height: 7px
}

.mce-scrollbar-thumb {
    position: absolute;
    background-color: #000;
    border: 1px solid #888;
    border-color: rgba(85, 85, 85, .6);
    width: 5px;
    height: 100%
}

.mce-scrollbar-h .mce-scrollbar-thumb {
    width: 100%;
    height: 5px
}

.mce-scrollbar.mce-active, .mce-scrollbar:hover {
    background-color: #aaa;
    opacity: .6;
    filter: alpha(opacity=60);
    zoom: 1
}

.mce-scroll {
    position: relative
}

.mce-panel {
    border: 0 solid #cacaca;
    border: 0 solid rgba(0, 0, 0, .2);
    background-color: #f0f0f0
}

.mce-floatpanel {
    position: absolute
}

.mce-floatpanel.mce-fixed {
    position: fixed
}

.mce-floatpanel .mce-arrow, .mce-floatpanel .mce-arrow:after {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid
}

.mce-floatpanel .mce-arrow {
    border-width: 11px
}

.mce-floatpanel .mce-arrow:after {
    border-width: 10px;
    content: ""
}

.mce-floatpanel.mce-popover {
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    background: transparent;
    top: 0;
    left: 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .2);
    border: 1px solid rgba(0, 0, 0, .25)
}

.mce-floatpanel.mce-popover.mce-bottom {
    margin-top: 10px;
    *margin-top: 0
}

.mce-floatpanel.mce-popover.mce-bottom > .mce-arrow {
    left: 50%;
    margin-left: -11px;
    border-top-width: 0;
    border-bottom-color: rgba(0, 0, 0, .2);
    border-bottom-color: rgba(0, 0, 0, .25);
    top: -11px
}

.mce-floatpanel.mce-popover.mce-bottom > .mce-arrow:after {
    top: 1px;
    margin-left: -10px;
    border-top-width: 0;
    border-bottom-color: #fff
}

.mce-floatpanel.mce-popover.mce-bottom.mce-start {
    margin-left: -22px
}

.mce-floatpanel.mce-popover.mce-bottom.mce-start > .mce-arrow {
    left: 20px
}

.mce-floatpanel.mce-popover.mce-bottom.mce-end {
    margin-left: 22px
}

.mce-floatpanel.mce-popover.mce-bottom.mce-end > .mce-arrow {
    right: 10px;
    left: auto
}

.mce-fullscreen {
    border: 0;
    padding: 0;
    margin: 0;
    overflow: hidden;
    height: 100%
}

#mce-modal-block, div.mce-fullscreen {
    position: fixed;
    top: 0;
    left: 0
}

#mce-modal-block {
    opacity: 0;
    filter: alpha(opacity=0);
    zoom: 1;
    width: 100%;
    height: 100%;
    background: #000
}

#mce-modal-block.mce-in {
    opacity: .3;
    filter: alpha(opacity=30);
    zoom: 1
}

.mce-window-move {
    cursor: move
}

.mce-window {
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    background: transparent;
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0;
    transform: scale(.1);
    transition: transform .1s ease-in, opacity .15s ease-in
}

.mce-window.mce-in {
    transform: scale(1);
    opacity: 1
}

.mce-window-head {
    padding: 9px 15px;
    border-bottom: 1px solid #c5c5c5;
    position: relative
}

.mce-window-head .mce-close {
    position: absolute;
    right: 0;
    top: 0;
    height: 38px;
    width: 38px;
    text-align: center;
    cursor: pointer
}

.mce-window-head .mce-close i {
    color: #858585
}

.mce-close:hover i {
    color: #adadad
}

.mce-window-head .mce-title {
    line-height: 20px;
    font-size: 20px;
    font-weight: 700;
    text-rendering: optimizelegibility;
    padding-right: 20px
}

.mce-foot, .mce-window .mce-container-body {
    display: block
}

.mce-foot {
    background-color: #fff;
    border-top: 1px solid #c5c5c5
}

.mce-window-head .mce-dragh {
    position: absolute;
    top: 0;
    left: 0;
    cursor: move;
    width: 90%;
    height: 100%
}

.mce-window iframe {
    width: 100%;
    height: 100%
}

.mce-window-body .mce-listbox {
    border-color: #ccc
}

.mce-rtl .mce-window-head .mce-close {
    position: absolute;
    right: auto;
    left: 15px
}

.mce-rtl .mce-window-head .mce-dragh {
    left: auto;
    right: 0
}

.mce-rtl .mce-window-head .mce-title {
    direction: rtl;
    text-align: right
}

.mce-tooltip {
    position: absolute;
    padding: 5px;
    opacity: .8;
    filter: alpha(opacity=80);
    zoom: 1
}

.mce-tooltip-inner {
    font-size: 11px;
    background-color: #000;
    color: #fff;
    max-width: 200px;
    padding: 5px 8px 4px;
    text-align: center;
    white-space: normal
}

.mce-tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    line-height: 0;
    border: 5px dashed #000
}

.mce-tooltip-arrow-n {
    border-bottom-color: #000
}

.mce-tooltip-arrow-s {
    border-top-color: #000
}

.mce-tooltip-arrow-e {
    border-left-color: #000
}

.mce-tooltip-arrow-w {
    border-right-color: #000
}

.mce-tooltip-nw, .mce-tooltip-sw {
    margin-left: -14px
}

.mce-tooltip-ne, .mce-tooltip-se {
    margin-left: 14px
}

.mce-tooltip-n .mce-tooltip-arrow {
    left: 50%;
    margin-left: -5px
}

.mce-tooltip-n .mce-tooltip-arrow, .mce-tooltip-nw .mce-tooltip-arrow {
    top: 0;
    border-bottom-style: solid;
    border-top: none;
    border-left-color: transparent;
    border-right-color: transparent
}

.mce-tooltip-nw .mce-tooltip-arrow {
    left: 10px
}

.mce-tooltip-ne .mce-tooltip-arrow {
    top: 0;
    right: 10px;
    border-bottom-style: solid;
    border-top: none;
    border-left-color: transparent;
    border-right-color: transparent
}

.mce-tooltip-s .mce-tooltip-arrow {
    left: 50%;
    margin-left: -5px
}

.mce-tooltip-s .mce-tooltip-arrow, .mce-tooltip-sw .mce-tooltip-arrow {
    bottom: 0;
    border-top-style: solid;
    border-bottom: none;
    border-left-color: transparent;
    border-right-color: transparent
}

.mce-tooltip-sw .mce-tooltip-arrow {
    left: 10px
}

.mce-tooltip-se .mce-tooltip-arrow {
    bottom: 0;
    right: 10px;
    border-top-style: solid;
    border-bottom: none;
    border-left-color: transparent;
    border-right-color: transparent
}

.mce-tooltip-e .mce-tooltip-arrow {
    right: 0;
    top: 50%;
    margin-top: -5px;
    border-left-style: solid;
    border-right: none;
    border-top-color: transparent;
    border-bottom-color: transparent
}

.mce-tooltip-w .mce-tooltip-arrow {
    left: 0;
    top: 50%;
    margin-top: -5px;
    border-right-style: solid;
    border-left: none;
    border-top-color: transparent;
    border-bottom-color: transparent
}

.mce-progress {
    display: inline-block;
    position: relative;
    height: 20px
}

.mce-progress .mce-bar-container {
    display: inline-block;
    width: 100px;
    height: 100%;
    margin-right: 8px;
    border: 1px solid #ccc;
    overflow: hidden
}

.mce-progress .mce-text {
    display: inline-block;
    margin-top: auto;
    margin-bottom: auto;
    font-size: 14px;
    width: 40px;
    color: #333
}

.mce-bar {
    display: block;
    width: 0;
    height: 100%;
    background-color: #d7d7d7;
    -webkit-transition: width .2s ease;
    transition: width .2s ease
}

.mce-notification {
    position: absolute;
    background-color: #f0f0f0;
    padding: 5px;
    margin-top: 5px;
    border: 1px solid #ccc;
    transition: transform .1s ease-in, opacity .15s ease-in;
    opacity: 0
}

.mce-notification.mce-in {
    opacity: 1
}

.mce-notification-success {
    background-color: #dff0d8;
    border-color: #d6e9c6
}

.mce-notification-info {
    background-color: #d9edf7;
    border-color: #779ecb
}

.mce-notification-warning {
    background-color: #fcf8e3;
    border-color: #faebcc
}

.mce-notification-error {
    background-color: #f2dede;
    border-color: #ebccd1
}

.mce-notification.mce-has-close {
    padding-right: 15px
}

.mce-notification .mce-ico {
    margin-top: 5px
}

.mce-notification-inner {
    display: inline-block;
    font-size: 14px;
    margin: 5px 8px 4px;
    text-align: center;
    white-space: normal;
    color: #31708f
}

.mce-notification-inner a {
    text-decoration: underline;
    cursor: pointer
}

.mce-notification .mce-progress {
    margin-right: 8px
}

.mce-notification .mce-progress .mce-text {
    margin-top: 5px
}

.mce-notification *, .mce-notification .mce-progress .mce-text {
    color: #333
}

.mce-notification .mce-progress .mce-bar-container {
    border-color: #ccc
}

.mce-notification .mce-progress .mce-bar-container .mce-bar {
    background-color: #333
}

.mce-notification-success *, .mce-notification-success .mce-progress .mce-text {
    color: #3c763d
}

.mce-notification-success .mce-progress .mce-bar-container {
    border-color: #d6e9c6
}

.mce-notification-success .mce-progress .mce-bar-container .mce-bar {
    background-color: #3c763d
}

.mce-notification-info *, .mce-notification-info .mce-progress .mce-text {
    color: #31708f
}

.mce-notification-info .mce-progress .mce-bar-container {
    border-color: #779ecb
}

.mce-notification-info .mce-progress .mce-bar-container .mce-bar {
    background-color: #31708f
}

.mce-notification-warning *, .mce-notification-warning .mce-progress .mce-text {
    color: #8a6d3b
}

.mce-notification-warning .mce-progress .mce-bar-container {
    border-color: #faebcc
}

.mce-notification-warning .mce-progress .mce-bar-container .mce-bar {
    background-color: #8a6d3b
}

.mce-notification-error *, .mce-notification-error .mce-progress .mce-text {
    color: #a94442
}

.mce-notification-error .mce-progress .mce-bar-container {
    border-color: #ebccd1
}

.mce-notification-error .mce-progress .mce-bar-container .mce-bar {
    background-color: #a94442
}

.mce-notification .mce-close {
    position: absolute;
    top: 6px;
    right: 8px;
    font-size: 20px;
    font-weight: 700;
    line-height: 20px;
    color: #858585;
    cursor: pointer;
    height: 20px;
    overflow: hidden
}

.mce-abs-layout {
    position: relative
}

.mce-abs-end, body .mce-abs-layout-item {
    position: absolute
}

.mce-abs-end {
    width: 1px;
    height: 1px
}

.mce-container-body.mce-abs-layout {
    overflow: hidden
}

.mce-btn {
    border: 1px solid #b1b1b1;
    border-color: transparent;
    position: relative;
    text-shadow: 0 1px 1px hsla(0, 0%, 100%, .75);
    display: inline-block;
    *display: inline;
    *zoom: 1;
    background-color: #f0f0f0
}

.mce-btn:focus, .mce-btn:hover {
    color: #333;
    background-color: #e3e3e3;
    border-color: #ccc
}

.mce-btn.mce-disabled:hover button, .mce-btn.mce-disabled button {
    cursor: default;
    opacity: .4;
    filter: alpha(opacity=40);
    zoom: 1
}

.mce-btn.mce-active, .mce-btn.mce-active:hover {
    background-color: #dbdbdb;
    border-color: #ccc
}

.mce-btn:active {
    background-color: #e0e0e0;
    border-color: #ccc
}

.mce-btn button {
    padding: 4px 8px;
    font-size: 14px;
    line-height: 20px;
    *line-height: 16px;
    cursor: pointer;
    color: #333;
    text-align: center;
    overflow: visible;
    -webkit-appearance: none
}

.mce-btn button::-moz-focus-inner {
    border: 0;
    padding: 0
}

.mce-btn i {
    text-shadow: 1px 1px none
}

.mce-primary.mce-btn-has-text {
    min-width: 50px
}

.mce-primary {
    color: #fff;
    border: 1px solid transparent;
    border-color: transparent;
    background-color: #2d8ac7
}

.mce-primary:focus, .mce-primary:hover {
    background-color: #257cb6;
    border-color: transparent
}

.mce-primary.mce-disabled:hover button, .mce-primary.mce-disabled button {
    cursor: default;
    opacity: .4;
    filter: alpha(opacity=40);
    zoom: 1
}

.mce-primary.mce-active, .mce-primary.mce-active:hover, .mce-primary:not(.mce-disabled):active {
    background-color: #206ea1
}

.mce-primary button, .mce-primary button i {
    color: #fff;
    text-shadow: 1px 1px none
}

.mce-btn .mce-txt {
    font-size: inherit;
    line-height: inherit;
    color: inherit
}

.mce-btn-large button {
    padding: 9px 14px;
    font-size: 16px;
    line-height: normal
}

.mce-btn-large i {
    margin-top: 2px
}

.mce-btn-small button {
    padding: 1px 5px;
    font-size: 12px;
    *padding-bottom: 2px
}

.mce-btn-small i {
    line-height: 20px;
    vertical-align: top;
    *line-height: 18px
}

.mce-btn-small .mce-caret, .mce-btn .mce-caret {
    margin-top: 8px;
    margin-left: 0
}

.mce-caret {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    width: 0;
    height: 0;
    vertical-align: top;
    border-top: 4px solid #333;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    content: ""
}

.mce-disabled .mce-caret {
    border-top-color: #aaa
}

.mce-caret.mce-up {
    border-bottom: 4px solid #333;
    border-top: 0
}

.mce-btn-flat {
    border: 0;
    background: transparent;
    filter: none
}

.mce-btn-flat.mce-active, .mce-btn-flat:active, .mce-btn-flat:focus, .mce-btn-flat:hover {
    border: 0;
    background: #e6e6e6;
    filter: none
}

.mce-btn-has-text .mce-ico {
    padding-right: 5px
}

.mce-rtl .mce-btn button {
    direction: rtl
}

.mce-btn-group .mce-btn {
    border-width: 1px;
    margin: 0;
    margin-left: 2px
}

.mce-btn-group:not(:first-child) {
    border-left: 1px solid #d9d9d9;
    padding-left: 3px;
    margin-left: 3px
}

.mce-btn-group .mce-first {
    margin-left: 0
}

.mce-btn-group .mce-btn.mce-flow-layout-item {
    margin: 0
}

.mce-rtl .mce-btn-group .mce-btn {
    margin-left: 0;
    margin-right: 2px
}

.mce-rtl .mce-btn-group .mce-first {
    margin-right: 0
}

.mce-rtl .mce-btn-group:not(:first-child) {
    border-left: none;
    border-right: 1px solid #d9d9d9;
    padding-right: 4px;
    margin-right: 4px
}

.mce-checkbox {
    cursor: pointer
}

i.mce-i-checkbox {
    margin: 0 3px 0 0;
    border: 1px solid #c5c5c5;
    background-color: #f0f0f0;
    text-indent: -10em;
    *font-size: 0;
    *line-height: 0;
    *text-indent: 0;
    overflow: hidden
}

.mce-checked i.mce-i-checkbox {
    color: #333;
    font-size: 16px;
    line-height: 16px;
    text-indent: 0
}

.mce-checkbox.mce-focus i.mce-i-checkbox, .mce-checkbox:focus i.mce-i-checkbox {
    border: 1px solid rgba(82, 168, 236, .8)
}

.mce-checkbox.mce-disabled .mce-label, .mce-checkbox.mce-disabled i.mce-i-checkbox {
    color: #acacac
}

.mce-checkbox .mce-label {
    vertical-align: middle
}

.mce-rtl .mce-checkbox {
    direction: rtl;
    text-align: right
}

.mce-rtl i.mce-i-checkbox {
    margin: 0 0 0 3px
}

.mce-combobox {
    position: relative;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    *height: 32px
}

.mce-combobox input {
    border: 1px solid #c5c5c5;
    border-right-color: #c5c5c5;
    height: 28px
}

.mce-combobox.mce-disabled input {
    color: #adadad
}

.mce-combobox .mce-btn {
    border: 1px solid #c5c5c5;
    border-left: 0;
    margin: 0
}

.mce-combobox button {
    padding-right: 8px;
    padding-left: 8px
}

.mce-combobox.mce-disabled .mce-btn button {
    cursor: default;
    opacity: .4;
    filter: alpha(opacity=40);
    zoom: 1
}

.mce-combobox .mce-status {
    position: absolute;
    right: 2px;
    top: 50%;
    line-height: 16px;
    margin-top: -8px;
    font-size: 12px;
    width: 15px;
    height: 15px;
    text-align: center;
    cursor: pointer
}

.mce-combobox.mce-has-status input {
    padding-right: 20px
}

.mce-combobox.mce-has-open .mce-status {
    right: 37px
}

.mce-combobox .mce-status.mce-i-warning {
    color: #c09853
}

.mce-combobox .mce-status.mce-i-checkmark {
    color: #468847
}

.mce-menu.mce-combobox-menu {
    border-top: 0;
    margin-top: 0;
    max-height: 200px
}

.mce-menu.mce-combobox-menu .mce-menu-item {
    padding: 4px 6px 4px 4px;
    font-size: 11px
}

.mce-menu.mce-combobox-menu .mce-menu-item-sep {
    padding: 0
}

.mce-menu.mce-combobox-menu .mce-menu-item-link, .mce-menu.mce-combobox-menu .mce-menu-item-link b, .mce-menu.mce-combobox-menu .mce-text, .mce-menu.mce-combobox-menu .mce-text b {
    font-size: 11px
}

.mce-colorbox i {
    border: 1px solid #c5c5c5;
    width: 14px;
    height: 14px
}

.mce-colorbutton .mce-ico {
    position: relative
}

.mce-colorbutton-grid {
    margin: 4px
}

.mce-colorbutton button {
    padding-right: 6px;
    padding-left: 6px
}

.mce-colorbutton .mce-preview {
    padding-right: 3px;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -17px;
    margin-top: 7px;
    background: gray;
    width: 13px;
    height: 2px;
    overflow: hidden
}

.mce-colorbutton.mce-btn-small .mce-preview {
    margin-left: -16px;
    padding-right: 0;
    width: 16px
}

.mce-colorbutton .mce-open {
    padding-left: 4px;
    padding-right: 4px;
    border-left: 1px solid transparent
}

.mce-colorbutton:hover .mce-open {
    border-color: #ccc
}

.mce-colorbutton.mce-btn-small .mce-open {
    padding: 0 3px
}

.mce-rtl .mce-colorbutton {
    direction: rtl
}

.mce-rtl .mce-colorbutton .mce-preview {
    margin-left: 0;
    padding-right: 0;
    padding-left: 3px
}

.mce-rtl .mce-colorbutton.mce-btn-small .mce-preview {
    margin-left: 0;
    padding-right: 0;
    padding-left: 2px
}

.mce-rtl .mce-colorbutton .mce-open {
    padding-left: 4px;
    padding-right: 4px;
    border-left: 0
}

.mce-colorpicker {
    position: relative;
    width: 250px;
    height: 220px
}

.mce-colorpicker-sv {
    position: absolute;
    top: 0;
    left: 0;
    width: 90%;
    height: 100%;
    border: 1px solid #c5c5c5;
    cursor: crosshair;
    overflow: hidden
}

.mce-colorpicker-h-chunk {
    width: 100%
}

.mce-colorpicker-overlay1, .mce-colorpicker-overlay2 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.mce-colorpicker-overlay1 {
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr="#ffffff", endColorstr="#00ffffff");
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#ffffff', endColorstr='#00ffffff')";
    background: linear-gradient(90deg, #fff, hsla(0, 0%, 100%, 0))
}

.mce-colorpicker-overlay2 {
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr="#00000000", endColorstr="#000000");
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#00000000', endColorstr='#000000')";
    background: linear-gradient(180deg, transparent, #000)
}

.mce-colorpicker-selector1 {
    background: none;
    position: absolute;
    width: 12px;
    height: 12px;
    margin: -8px 0 0 -8px;
    border: 1px solid #000;
    border-radius: 50%
}

.mce-colorpicker-selector2 {
    position: absolute;
    width: 10px;
    height: 10px;
    border: 1px solid #fff;
    border-radius: 50%
}

.mce-colorpicker-h {
    position: absolute;
    top: 0;
    right: 0;
    width: 6.5%;
    height: 100%;
    border: 1px solid #c5c5c5;
    cursor: crosshair
}

.mce-colorpicker-h-marker {
    margin-top: -4px;
    position: absolute;
    top: 0;
    left: -1px;
    width: 100%;
    border: 1px solid #333;
    background: #fff;
    height: 4px;
    z-index: 100
}

.mce-path {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    padding: 8px;
    white-space: normal
}

.mce-path .mce-txt {
    padding-right: 3px
}

.mce-path .mce-path-body, .mce-path .mce-txt {
    display: inline-block
}

.mce-path-item {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    cursor: pointer;
    color: #333
}

.mce-path-item:hover {
    text-decoration: underline
}

.mce-path-item:focus {
    background: #666;
    color: #fff
}

.mce-path .mce-divider {
    display: inline
}

.mce-disabled .mce-path-item {
    color: #aaa
}

.mce-rtl .mce-path {
    direction: rtl
}

.mce-fieldset {
    border: 0 solid #9e9e9e
}

.mce-fieldset > .mce-container-body {
    margin-top: -15px
}

.mce-fieldset-title {
    margin-left: 5px;
    padding: 0 5px
}

.mce-fit-layout {
    display: inline-block;
    *display: inline;
    *zoom: 1
}

.mce-fit-layout-item {
    position: absolute
}

.mce-flow-layout-item {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    margin: 2px 0 2px 2px
}

.mce-flow-layout-item.mce-last {
    margin-right: 2px
}

.mce-flow-layout {
    white-space: normal
}

.mce-tinymce-inline .mce-flow-layout {
    white-space: nowrap
}

.mce-rtl .mce-flow-layout {
    text-align: right;
    direction: rtl
}

.mce-rtl .mce-flow-layout-item {
    margin: 2px 2px 2px 0
}

.mce-rtl .mce-flow-layout-item.mce-last {
    margin-left: 2px
}

.mce-iframe {
    border: 0 solid rgba(0, 0, 0, .2);
    width: 100%;
    height: 100%
}

.mce-infobox {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    text-shadow: 0 1px 1px hsla(0, 0%, 100%, .75);
    overflow: hidden;
    border: 1px solid red
}

.mce-infobox div {
    display: block;
    margin: 5px
}

.mce-infobox div button {
    position: absolute;
    top: 50%;
    right: 4px;
    cursor: pointer;
    margin-top: -8px;
    display: none
}

.mce-infobox div button:focus {
    outline: 2px solid #ccc
}

.mce-infobox.mce-has-help div {
    margin-right: 25px
}

.mce-infobox.mce-has-help button {
    display: block
}

.mce-infobox.mce-success {
    background: #dff0d8;
    border-color: #d6e9c6
}

.mce-infobox.mce-success div {
    color: #3c763d
}

.mce-infobox.mce-warning {
    background: #fcf8e3;
    border-color: #faebcc
}

.mce-infobox.mce-warning div {
    color: #8a6d3b
}

.mce-infobox.mce-error {
    background: #f2dede;
    border-color: #ebccd1
}

.mce-infobox.mce-error div {
    color: #a94442
}

.mce-rtl .mce-infobox div {
    text-align: right;
    direction: rtl
}

.mce-label {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    text-shadow: 0 1px 1px hsla(0, 0%, 100%, .75);
    overflow: hidden
}

.mce-label.mce-autoscroll {
    overflow: auto
}

.mce-label.mce-disabled {
    color: #aaa
}

.mce-label.mce-multiline {
    white-space: pre-wrap
}

.mce-label.mce-success {
    color: #468847
}

.mce-label.mce-warning {
    color: #c09853
}

.mce-label.mce-error {
    color: #b94a48
}

.mce-rtl .mce-label {
    text-align: right;
    direction: rtl
}

.mce-menubar .mce-menubtn {
    border-color: transparent;
    background: transparent;
    filter: none
}

.mce-menubar .mce-menubtn button {
    color: #333
}

.mce-menubar {
    border: 1px solid hsla(0, 0%, 85%, .52)
}

.mce-menubar .mce-menubtn button span {
    color: #333
}

.mce-menubar .mce-caret {
    border-top-color: #333
}

.mce-menubar .mce-menubtn.mce-active, .mce-menubar .mce-menubtn:focus, .mce-menubar .mce-menubtn:hover {
    border-color: #ccc;
    background: #fff;
    filter: none
}

.mce-menubtn button {
    color: #333
}

.mce-menubtn.mce-btn-small span {
    font-size: 12px
}

.mce-menubtn.mce-fixed-width span {
    display: inline-block;
    overflow-x: hidden;
    text-overflow: ellipsis;
    width: 90px
}

.mce-menubtn.mce-fixed-width.mce-btn-small span {
    width: 70px
}

.mce-menubtn .mce-caret {
    *margin-top: 6px
}

.mce-rtl .mce-menubtn button {
    direction: rtl;
    text-align: right
}

.mce-menu-item {
    display: block;
    padding: 6px 15px 6px 12px;
    clear: both;
    font-weight: 400;
    line-height: 20px;
    color: #333;
    white-space: nowrap;
    cursor: pointer;
    line-height: normal;
    border-left: 4px solid transparent;
    margin-bottom: 1px
}

.mce-menu-item .mce-ico, .mce-menu-item .mce-text {
    color: #333
}

.mce-menu-item.mce-disabled .mce-ico, .mce-menu-item.mce-disabled .mce-text {
    color: #adadad
}

.mce-menu-item.mce-selected .mce-ico, .mce-menu-item.mce-selected .mce-text, .mce-menu-item:focus .mce-ico, .mce-menu-item:focus .mce-text, .mce-menu-item:hover .mce-ico, .mce-menu-item:hover .mce-text {
    color: #fff
}

.mce-menu-item.mce-disabled:hover {
    background: #ccc
}

.mce-menu-shortcut {
    color: #adadad;
    display: inline-block;
    display: inline;
    zoom: 1;
    padding: 0 15px 0 20px
}

.mce-menu-item.mce-selected .mce-menu-shortcut, .mce-menu-item:focus .mce-menu-shortcut, .mce-menu-item:hover .mce-menu-shortcut {
    color: #fff
}

.mce-menu-item .mce-caret {
    margin-top: 4px;
    *margin-top: 3px;
    margin-right: 6px;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 4px solid #333
}

.mce-menu-item.mce-selected .mce-caret, .mce-menu-item:focus .mce-caret, .mce-menu-item:hover .mce-caret {
    border-left-color: #fff
}

.mce-menu-align .mce-menu-shortcut {
    *margin-top: -2px
}

.mce-menu-align .mce-caret, .mce-menu-align .mce-menu-shortcut {
    position: absolute;
    right: 0
}

.mce-menu-item.mce-active i {
    visibility: visible
}

.mce-menu-item-normal.mce-active {
    background-color: #3498db
}

.mce-menu-item-preview.mce-active {
    border-left: 5px solid #aaa
}

.mce-menu-item-normal.mce-active .mce-text, .mce-menu-item-normal.mce-active:focus .mce-ico, .mce-menu-item-normal.mce-active:focus .mce-text, .mce-menu-item-normal.mce-active:hover .mce-ico, .mce-menu-item-normal.mce-active:hover .mce-text {
    color: #fff
}

.mce-menu-item.mce-selected, .mce-menu-item:focus, .mce-menu-item:hover {
    text-decoration: none;
    color: #fff;
    background-color: #2d8ac7
}

.mce-menu-item-link {
    color: #093;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.mce-menu-item-link b {
    color: #093
}

.mce-menu-item-ellipsis {
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.mce-menu-item.mce-selected *, .mce-menu-item:focus *, .mce-menu-item:hover * {
    color: #fff
}

.mce-menu-item-sep:hover, div.mce-menu .mce-menu-item-sep {
    border: 0;
    padding: 0;
    height: 1px;
    margin: 9px 1px;
    overflow: hidden;
    background: transparent;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    cursor: default;
    filter: none
}

div.mce-menu .mce-menu-item b {
    font-weight: 700
}

.mce-menu-item-indent-1 {
    padding-left: 20px
}

.mce-menu-item-indent-2 {
    padding-left: 35px
}

.mce-menu-item-indent-3 {
    padding-left: 40px
}

.mce-menu-item-indent-4 {
    padding-left: 45px
}

.mce-menu-item-indent-5 {
    padding-left: 50px
}

.mce-menu-item-indent-6 {
    padding-left: 55px
}

.mce-menu.mce-rtl {
    direction: rtl
}

.mce-rtl .mce-menu-item {
    text-align: right;
    direction: rtl;
    padding: 6px 12px 6px 15px
}

.mce-menu-align.mce-rtl .mce-caret, .mce-menu-align.mce-rtl .mce-menu-shortcut {
    right: auto;
    left: 0
}

.mce-rtl .mce-menu-item .mce-caret {
    margin-left: 6px;
    margin-right: 0;
    border-right: 4px solid #333;
    border-left: 0
}

.mce-rtl .mce-menu-item.mce-selected .mce-caret, .mce-rtl .mce-menu-item:focus .mce-caret, .mce-rtl .mce-menu-item:hover .mce-caret {
    border-left-color: transparent;
    border-right-color: #fff
}

.mce-throbber {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
    filter: alpha(opacity=60);
    zoom: 1;
    background: #fff url() no-repeat 50%
}

.mce-throbber-inline {
    position: static;
    height: 50px
}

.mce-menu .mce-throbber-inline {
    height: 25px;
    background-size: contain
}

.mce-menu {
    position: absolute;
    left: 0;
    top: 0;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    background: transparent;
    z-index: 1000;
    padding: 5px 0;
    margin: -1px 0 0;
    min-width: 160px;
    background: #fff;
    border: 1px solid #989898;
    border: 1px solid rgba(0, 0, 0, .2);
    z-index: 1002;
    max-height: 400px;
    overflow: auto;
    overflow-x: hidden
}

.mce-menu i {
    display: none
}

.mce-menu-has-icons i {
    display: inline-block;
    *display: inline
}

.mce-menu-sub-tr-tl {
    margin: -6px 0 0 -1px
}

.mce-menu-sub-br-bl {
    margin: 6px 0 0 -1px
}

.mce-menu-sub-tl-tr {
    margin: -6px 0 0 1px
}

.mce-menu-sub-bl-br {
    margin: 6px 0 0 1px
}

.mce-listbox button {
    text-align: left;
    padding-right: 20px;
    position: relative
}

.mce-listbox .mce-caret {
    position: absolute;
    margin-top: -2px;
    right: 8px;
    top: 50%
}

.mce-rtl .mce-listbox .mce-caret {
    right: auto;
    left: 8px
}

.mce-rtl .mce-listbox button {
    padding-right: 10px;
    padding-left: 20px
}

.mce-container-body .mce-resizehandle {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 16px;
    height: 16px;
    visibility: visible;
    cursor: s-resize;
    margin: 0
}

.mce-container-body .mce-resizehandle-both {
    cursor: se-resize
}

i.mce-i-resize {
    color: #333
}

.mce-selectbox {
    background: #fff;
    border: 1px solid #c5c5c5
}

.mce-slider {
    border: 1px solid #aaa;
    background: #eee;
    width: 100px;
    height: 10px;
    position: relative;
    display: block
}

.mce-slider.mce-vertical {
    width: 10px;
    height: 100px
}

.mce-slider-handle {
    border: 1px solid #bbb;
    background: #ddd;
    display: block;
    width: 13px;
    height: 13px;
    position: absolute;
    top: 0;
    left: 0;
    margin-left: -1px;
    margin-top: -2px
}

.mce-slider-handle:focus {
    background: #bbb
}

.mce-spacer {
    visibility: hidden
}

.mce-splitbtn .mce-open {
    border-left: 1px solid transparent
}

.mce-splitbtn:hover .mce-open {
    border-left-color: #ccc
}

.mce-splitbtn button {
    padding-right: 6px;
    padding-left: 6px
}

.mce-splitbtn .mce-open {
    padding-right: 4px;
    padding-left: 4px
}

.mce-splitbtn .mce-open.mce-active {
    background-color: #dbdbdb;
    outline: 1px solid #ccc
}

.mce-splitbtn.mce-btn-small .mce-open {
    padding: 0 3px
}

.mce-rtl .mce-splitbtn {
    direction: rtl;
    text-align: right
}

.mce-rtl .mce-splitbtn button {
    padding-right: 4px;
    padding-left: 4px
}

.mce-rtl .mce-splitbtn .mce-open {
    border-left: 0
}

.mce-stack-layout-item, .mce-tabs {
    display: block
}

.mce-tabs {
    border-bottom: 1px solid #c5c5c5
}

.mce-tab, .mce-tabs, .mce-tabs + .mce-container-body {
    background: #fff
}

.mce-tab {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    border: 1px solid #c5c5c5;
    border-width: 0 1px 0 0;
    padding: 8px;
    text-shadow: 0 1px 1px hsla(0, 0%, 100%, .75);
    height: 13px;
    cursor: pointer
}

.mce-tab:hover {
    background: #fdfdfd
}

.mce-tab.mce-active {
    background: #fdfdfd;
    border-bottom-color: transparent;
    margin-bottom: -1px;
    height: 14px
}

.mce-rtl .mce-tabs {
    text-align: right;
    direction: rtl
}

.mce-rtl .mce-tab {
    border-width: 0 0 0 1px
}

.mce-textbox {
    background: #fff;
    border: 1px solid #c5c5c5;
    display: inline-block;
    -webkit-transition: border .2s linear, box-shadow .2s linear;
    transition: border .2s linear, box-shadow .2s linear;
    height: 28px;
    resize: none;
    padding: 0 4px;
    white-space: pre-wrap;
    *white-space: pre;
    color: #333
}

.mce-textbox.mce-focus, .mce-textbox:focus {
    border-color: #3498db
}

.mce-placeholder .mce-textbox {
    color: #aaa
}

.mce-textbox.mce-multiline {
    padding: 4px;
    height: auto
}

.mce-textbox.mce-disabled {
    color: #adadad
}

.mce-rtl .mce-textbox {
    text-align: right;
    direction: rtl
}

@font-face {
    font-family: tinymce;
    src: url(//g.alicdn.com/qbi/qbi/1.1.4/tinymce.eot);
    src: url(//g.alicdn.com/qbi/qbi/1.1.4/tinymce.eot?#iefix) format("embedded-opentype"), url(//g.alicdn.com/qbi/qbi/1.1.4/tinymce.woff) format("woff"), url(//g.alicdn.com/qbi/qbi/1.1.4/tinymce.ttf) format("truetype"), url(//g.alicdn.com/qbi/qbi/1.1.4/tinymce.svg#tinymce) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: tinymce-small;
    src: url(//g.alicdn.com/qbi/qbi/1.1.4/tinymce-small.eot);
    src: url(//g.alicdn.com/qbi/qbi/1.1.4/tinymce-small.eot?#iefix) format("embedded-opentype"), url(//g.alicdn.com/qbi/qbi/1.1.4/tinymce-small.woff) format("woff"), url(//g.alicdn.com/qbi/qbi/1.1.4/tinymce-small.ttf) format("truetype"), url(//g.alicdn.com/qbi/qbi/1.1.4/tinymce-small.svg#tinymce) format("svg");
    font-weight: 400;
    font-style: normal
}

.mce-ico {
    font-family: tinymce, Arial;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    font-size: 16px;
    line-height: 16px;
    speak: none;
    vertical-align: text-top;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    background: transparent 50%;
    background-size: cover;
    width: 16px;
    height: 16px;
    color: #333
}

.mce-btn-small .mce-ico {
    font-family: tinymce-small, Arial
}

.mce-i-save:before {
    content: "\E000"
}

.mce-i-newdocument:before {
    content: "\E001"
}

.mce-i-fullpage:before {
    content: "\E002"
}

.mce-i-alignleft:before {
    content: "\E003"
}

.mce-i-aligncenter:before {
    content: "\E004"
}

.mce-i-alignright:before {
    content: "\E005"
}

.mce-i-alignjustify:before {
    content: "\E006"
}

.mce-i-alignnone:before {
    content: "\E003"
}

.mce-i-cut:before {
    content: "\E007"
}

.mce-i-paste:before {
    content: "\E008"
}

.mce-i-searchreplace:before {
    content: "\E009"
}

.mce-i-bullist:before {
    content: "\E00A"
}

.mce-i-numlist:before {
    content: "\E00B"
}

.mce-i-indent:before {
    content: "\E00C"
}

.mce-i-outdent:before {
    content: "\E00D"
}

.mce-i-blockquote:before {
    content: "\E00E"
}

.mce-i-undo:before {
    content: "\E00F"
}

.mce-i-redo:before {
    content: "\E010"
}

.mce-i-link:before {
    content: "\E011"
}

.mce-i-unlink:before {
    content: "\E012"
}

.mce-i-anchor:before {
    content: "\E013"
}

.mce-i-image:before {
    content: "\E014"
}

.mce-i-media:before {
    content: "\E015"
}

.mce-i-help:before {
    content: "\E016"
}

.mce-i-code:before {
    content: "\E017"
}

.mce-i-insertdatetime:before {
    content: "\E018"
}

.mce-i-preview:before {
    content: "\E019"
}

.mce-i-backcolor:before, .mce-i-forecolor:before {
    content: "\E01A"
}

.mce-i-table:before {
    content: "\E01B"
}

.mce-i-hr:before {
    content: "\E01C"
}

.mce-i-removeformat:before {
    content: "\E01D"
}

.mce-i-subscript:before {
    content: "\E01E"
}

.mce-i-superscript:before {
    content: "\E01F"
}

.mce-i-charmap:before {
    content: "\E020"
}

.mce-i-emoticons:before {
    content: "\E021"
}

.mce-i-print:before {
    content: "\E022"
}

.mce-i-fullscreen:before {
    content: "\E023"
}

.mce-i-spellchecker:before {
    content: "\E024"
}

.mce-i-nonbreaking:before {
    content: "\E025"
}

.mce-i-template:before {
    content: "\E026"
}

.mce-i-pagebreak:before {
    content: "\E027"
}

.mce-i-restoredraft:before {
    content: "\E028"
}

.mce-i-bold:before {
    content: "\E02A"
}

.mce-i-italic:before {
    content: "\E02B"
}

.mce-i-underline:before {
    content: "\E02C"
}

.mce-i-strikethrough:before {
    content: "\E02D"
}

.mce-i-visualblocks:before, .mce-i-visualchars:before {
    content: "\E02E"
}

.mce-i-ltr:before {
    content: "\E02F"
}

.mce-i-rtl:before {
    content: "\E030"
}

.mce-i-copy:before {
    content: "\E031"
}

.mce-i-resize:before {
    content: "\E032"
}

.mce-i-browse:before {
    content: "\E034"
}

.mce-i-pastetext:before {
    content: "\E035"
}

.mce-i-rotateleft:before {
    content: "\EAA8"
}

.mce-i-rotateright:before {
    content: "\EAA9"
}

.mce-i-crop:before {
    content: "\EE78"
}

.mce-i-editimage:before {
    content: "\E915"
}

.mce-i-options:before {
    content: "\EC6A"
}

.mce-i-flipv:before {
    content: "\EAAA"
}

.mce-i-fliph:before {
    content: "\EAAC"
}

.mce-i-zoomin:before {
    content: "\EB35"
}

.mce-i-zoomout:before {
    content: "\EB36"
}

.mce-i-sun:before {
    content: "\ECCC"
}

.mce-i-moon:before {
    content: "\ECCD"
}

.mce-i-arrowleft:before {
    content: "\EDC0"
}

.mce-i-arrowright:before {
    content: "\E93C"
}

.mce-i-drop:before {
    content: "\E935"
}

.mce-i-contrast:before {
    content: "\ECD4"
}

.mce-i-sharpen:before {
    content: "\EBA7"
}

.mce-i-resize2:before {
    content: "\EDF9"
}

.mce-i-orientation:before {
    content: "\E601"
}

.mce-i-invert:before {
    content: "\E602"
}

.mce-i-gamma:before {
    content: "\E600"
}

.mce-i-remove:before {
    content: "\ED6A"
}

.mce-i-tablerowprops:before {
    content: "\E604"
}

.mce-i-tablecellprops:before {
    content: "\E605"
}

.mce-i-table2:before {
    content: "\E606"
}

.mce-i-tablemergecells:before {
    content: "\E607"
}

.mce-i-tableinsertcolbefore:before {
    content: "\E608"
}

.mce-i-tableinsertcolafter:before {
    content: "\E609"
}

.mce-i-tableinsertrowbefore:before {
    content: "\E60A"
}

.mce-i-tableinsertrowafter:before {
    content: "\E60B"
}

.mce-i-tablesplitcells:before {
    content: "\E60D"
}

.mce-i-tabledelete:before {
    content: "\E60E"
}

.mce-i-tableleftheader:before {
    content: "\E62A"
}

.mce-i-tabletopheader:before {
    content: "\E62B"
}

.mce-i-tabledeleterow:before {
    content: "\E800"
}

.mce-i-tabledeletecol:before {
    content: "\E801"
}

.mce-i-codesample:before {
    content: "\E603"
}

.mce-i-fill:before {
    content: "\E902"
}

.mce-i-borderwidth:before {
    content: "\E903"
}

.mce-i-line:before {
    content: "\E904"
}

.mce-i-count:before {
    content: "\E905"
}

.mce-i-translate:before {
    content: "\E907"
}

.mce-i-drag:before {
    content: "\E908"
}

.mce-i-home:before {
    content: "\E90B"
}

.mce-i-upload:before {
    content: "\E914"
}

.mce-i-bubble:before {
    content: "\E91C"
}

.mce-i-user:before {
    content: "\E91D"
}

.mce-i-lock:before {
    content: "\E926"
}

.mce-i-unlock:before {
    content: "\E927"
}

.mce-i-settings:before {
    content: "\E928"
}

.mce-i-remove2:before {
    content: "\E92A"
}

.mce-i-menu:before {
    content: "\E92D"
}

.mce-i-warning:before {
    content: "\E930"
}

.mce-i-question:before {
    content: "\E931"
}

.mce-i-pluscircle:before {
    content: "\E932"
}

.mce-i-info:before {
    content: "\E933"
}

.mce-i-notice:before {
    content: "\E934"
}

.mce-i-arrowup:before {
    content: "\E93B"
}

.mce-i-arrowdown:before {
    content: "\E93D"
}

.mce-i-arrowup2:before {
    content: "\E93F"
}

.mce-i-arrowdown2:before {
    content: "\E940"
}

.mce-i-menu2:before {
    content: "\E941"
}

.mce-i-newtab:before {
    content: "\E961"
}

.mce-i-a11y:before {
    content: "\E900"
}

.mce-i-insert:before, .mce-i-plus:before {
    content: "\E93A"
}

.mce-i-minus:before {
    content: "\E939"
}

.mce-i-books:before {
    content: "\E911"
}

.mce-i-reload:before {
    content: "\E906"
}

.mce-i-toc:before {
    content: "\E901"
}

.mce-i-checkbox:before, .mce-i-checkmark:before, .mce-i-selected:before {
    content: "\E033"
}

.mce-i-insert {
    font-size: 14px
}

.mce-i-selected {
    visibility: hidden
}

i.mce-i-backcolor {
    text-shadow: none;
    background: #bbb
}

.mce-content-body .mce-reset {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: top;
    background: transparent;
    text-decoration: none;
    color: #000;
    font-family: Arial;
    font-size: 11px;
    text-shadow: none;
    float: none;
    position: static;
    width: auto;
    height: auto;
    white-space: nowrap;
    cursor: inherit;
    line-height: normal;
    font-weight: 400;
    text-align: left;
    -webkit-tap-highlight-color: transparent;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    direction: ltr;
    max-width: none
}

.mce-object {
    border: 1px dotted #3a3a3a;
    background: #d5d5d5 url() no-repeat 50%
}

.mce-preview-object {
    display: inline-block;
    position: relative;
    margin: 0 2px;
    line-height: 0;
    border: 1px solid gray
}

.mce-preview-object[data-mce-selected="2"] .mce-shim {
    display: none
}

.mce-preview-object .mce-shim {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url()
}

figure.align-left {
    float: left
}

figure.align-right {
    float: right
}

figure.image.align-center {
    display: table;
    margin-left: auto;
    margin-right: auto
}

figure.image {
    display: inline-block;
    border: 1px solid gray;
    margin: 0 2px 0 1px;
    background: #f5f2f0
}

figure.image img {
    margin: 8px 8px 0
}

figure.image figcaption {
    margin: 6px 8px;
    text-align: center
}

.mce-toc {
    border: 1px solid gray
}

.mce-toc h2 {
    margin: 4px
}

.mce-toc li {
    list-style-type: none
}

.mce-pagebreak {
    cursor: default;
    display: block;
    border: 0;
    width: 100%;
    height: 5px;
    border: 1px dashed #666;
    margin-top: 15px;
    page-break-before: always
}

@media print {
    .mce-pagebreak {
        border: 0
    }
}

.mce-item-anchor {
    cursor: default;
    display: inline-block;
    -webkit-user-select: all;
    -webkit-user-modify: read-only;
    -moz-user-select: all;
    -moz-user-modify: read-only;
    user-select: all;
    user-modify: read-only;
    width: 9px !important;
    height: 9px !important;
    border: 1px dotted #3a3a3a;
    background: #d5d5d5 url() no-repeat 50%
}

.mce-nbsp, .mce-shy {
    background: #aaa
}

.mce-shy:after {
    content: "-"
}

hr {
    cursor: default
}

.mce-match-marker {
    background: #aaa;
    color: #fff
}

.mce-match-marker-selected {
    background: #39f;
    color: #fff
}

.mce-spellchecker-word {
    border-bottom: 2px solid red;
    cursor: default
}

.mce-spellchecker-grammar {
    border-bottom: 2px solid green;
    cursor: default
}

.mce-item-table, .mce-item-table caption, .mce-item-table td, .mce-item-table th {
    border: 1px dashed #bbb
}

td[data-mce-selected], th[data-mce-selected] {
    background-color: #39f !important
}

.mce-edit-focus {
    outline: 1px dotted #333
}

.mce-content-body [contentEditable=false] [contentEditable=true]:focus {
    outline: 2px solid #2d8ac7
}

.mce-content-body [contentEditable=false] [contentEditable=true]:hover {
    outline: 2px solid #7acaff
}

.mce-content-body [contentEditable=false][data-mce-selected] {
    outline: 2px solid #2d8ac7
}

.mce-resize-bar-dragging {
    background-color: blue;
    opacity: .25;
    filter: alpha(opacity=25);
    zoom: 1
}

.introjs-overlay {
    position: absolute;
    box-sizing: content-box;
    z-index: 999999;
    background-color: #000;
    opacity: 0;
    background: -moz-radial-gradient(center, ellipse cover, rgba(0, 0, 0, .4) 0, rgba(0, 0, 0, .9) 100%);
    background: -webkit-gradient(radial, center center, 0, center center, 100%, color-stop(0, rgba(0, 0, 0, .4)), color-stop(100%, rgba(0, 0, 0, .9)));
    background: -webkit-radial-gradient(center, ellipse cover, rgba(0, 0, 0, .4) 0, rgba(0, 0, 0, .9) 100%);
    background: -o-radial-gradient(center, ellipse cover, rgba(0, 0, 0, .4) 0, rgba(0, 0, 0, .9) 100%);
    background: -ms-radial-gradient(center, ellipse cover, rgba(0, 0, 0, .4) 0, rgba(0, 0, 0, .9) 100%);
    background: radial-gradient(center, ellipse cover, rgba(0, 0, 0, .4) 0, rgba(0, 0, 0, .9) 100%);
    filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#66000000',endColorstr='#e6000000',GradientType=1)";
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.introjs-fixParent {
    z-index: auto !important;
    opacity: 1 !important;
    -webkit-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    -o-transform: none !important;
    transform: none !important
}

.introjs-showElement, tr.introjs-showElement > td, tr.introjs-showElement > th {
    z-index: 9999999 !important
}

.introjs-disableInteraction {
    z-index: 99999999 !important;
    position: absolute;
    background-color: #fff;
    opacity: 0;
    filter: alpha(opacity=0)
}

.introjs-relativePosition, tr.introjs-showElement > td, tr.introjs-showElement > th {
    position: relative
}

.introjs-helperLayer {
    z-index: 9999998;
    background-color: #fff;
    background-color: hsla(0, 0%, 100%, .9);
    border: 1px solid #777;
    border: 1px solid rgba(0, 0, 0, .5);
    border-radius: 4px;
    box-shadow: 0 2px 15px rgba(0, 0, 0, .4)
}

.introjs-helperLayer, .introjs-tooltipReferenceLayer {
    box-sizing: content-box;
    position: absolute;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.introjs-tooltipReferenceLayer {
    visibility: hidden;
    z-index: 10000000;
    background-color: transparent
}

.introjs-helperLayer *, .introjs-helperLayer :after, .introjs-helperLayer :before {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    -ms-box-sizing: content-box;
    -o-box-sizing: content-box;
    box-sizing: content-box
}

.introjs-helperNumberLayer {
    box-sizing: content-box;
    position: absolute;
    visibility: visible;
    top: -16px;
    left: -16px;
    z-index: 9999999999 !important;
    padding: 2px;
    font-family: Arial, verdana, tahoma;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
    background: #ff3019;
    background: -webkit-linear-gradient(top, #ff3019, #cf0404);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff3019), color-stop(100%, #cf0404));
    background: -moz-linear-gradient(top, #ff3019 0, #cf0404 100%);
    background: -ms-linear-gradient(top, #ff3019 0, #cf0404 100%);
    background: -o-linear-gradient(top, #ff3019 0, #cf0404 100%);
    background: linear-gradient(180deg, #ff3019 0, #cf0404);
    width: 20px;
    height: 20px;
    line-height: 20px;
    border: 3px solid #fff;
    border-radius: 50%;
    filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3019', endColorstr='#cf0404', GradientType=0)";
    filter: "progid:DXImageTransform.Microsoft.Shadow(direction=135, strength=2, color=ff0000)";
    box-shadow: 0 2px 5px rgba(0, 0, 0, .4)
}

.introjs-arrow {
    border: 5px solid #fff;
    content: "";
    position: absolute
}

.introjs-arrow.top, .introjs-arrow.top-right {
    top: -10px;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: #fff;
    border-left-color: transparent
}

.introjs-arrow.top-right {
    right: 10px
}

.introjs-arrow.top-middle {
    top: -10px;
    left: 50%;
    margin-left: -5px;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: #fff;
    border-left-color: transparent
}

.introjs-arrow.right {
    top: 10px
}

.introjs-arrow.right, .introjs-arrow.right-bottom {
    right: -10px;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: #fff
}

.introjs-arrow.right-bottom {
    bottom: 10px
}

.introjs-arrow.bottom {
    bottom: -10px;
    border-top-color: #fff;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent
}

.introjs-arrow.left {
    top: 10px
}

.introjs-arrow.left, .introjs-arrow.left-bottom {
    left: -10px;
    border-top-color: transparent;
    border-right-color: #fff;
    border-bottom-color: transparent;
    border-left-color: transparent
}

.introjs-arrow.left-bottom {
    bottom: 10px
}

.introjs-tooltip {
    box-sizing: content-box;
    position: absolute;
    visibility: visible;
    padding: 10px;
    background-color: #fff;
    min-width: 200px;
    max-width: 300px;
    border-radius: 3px;
    box-shadow: 0 1px 10px rgba(0, 0, 0, .4);
    -webkit-transition: opacity .1s ease-out;
    -moz-transition: opacity .1s ease-out;
    -ms-transition: opacity .1s ease-out;
    -o-transition: opacity .1s ease-out;
    transition: opacity .1s ease-out
}

.introjs-tooltipbuttons {
    text-align: right;
    white-space: nowrap
}

.introjs-button {
    box-sizing: content-box;
    position: relative;
    overflow: visible;
    display: inline-block;
    padding: .3em .8em;
    border: 1px solid #d4d4d4;
    margin: 0;
    text-decoration: none;
    text-shadow: 1px 1px 0 #fff;
    font: 11px/normal sans-serif;
    color: #333;
    white-space: nowrap;
    cursor: pointer;
    outline: none;
    background-color: #ececec;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f4f4), to(#ececec));
    background-image: -moz-linear-gradient(#f4f4f4, #ececec);
    background-image: -o-linear-gradient(#f4f4f4, #ececec);
    background-image: linear-gradient(#f4f4f4, #ececec);
    -webkit-background-clip: padding;
    -moz-background-clip: padding;
    -o-background-clip: padding-box;
    -webkit-border-radius: .2em;
    -moz-border-radius: .2em;
    border-radius: .2em;
    zoom: 1;
    *display: inline;
    margin-top: 10px
}

.introjs-button:hover {
    border-color: #bcbcbc;
    text-decoration: none;
    box-shadow: 0 1px 1px #e3e3e3
}

.introjs-button:active, .introjs-button:focus {
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ececec), to(#f4f4f4));
    background-image: -moz-linear-gradient(#ececec, #f4f4f4);
    background-image: -o-linear-gradient(#ececec, #f4f4f4);
    background-image: linear-gradient(#ececec, #f4f4f4)
}

.introjs-button::-moz-focus-inner {
    padding: 0;
    border: 0
}

.introjs-skipbutton {
    box-sizing: content-box;
    margin-right: 5px;
    color: #7a7a7a
}

.introjs-prevbutton {
    -webkit-border-radius: .2em 0 0 .2em;
    -moz-border-radius: .2em 0 0 .2em;
    border-radius: .2em 0 0 .2em;
    border-right: none
}

.introjs-prevbutton.introjs-fullbutton {
    border: 1px solid #d4d4d4;
    -webkit-border-radius: .2em;
    -moz-border-radius: .2em;
    border-radius: .2em
}

.introjs-nextbutton {
    -webkit-border-radius: 0 .2em .2em 0;
    -moz-border-radius: 0 .2em .2em 0;
    border-radius: 0 .2em .2em 0
}

.introjs-nextbutton.introjs-fullbutton {
    -webkit-border-radius: .2em;
    -moz-border-radius: .2em;
    border-radius: .2em
}

.introjs-disabled, .introjs-disabled:focus, .introjs-disabled:hover {
    color: #9a9a9a;
    border-color: #d4d4d4;
    box-shadow: none;
    cursor: default;
    background-color: #f4f4f4;
    background-image: none;
    text-decoration: none
}

.introjs-hidden {
    display: none
}

.introjs-bullets {
    text-align: center
}

.introjs-bullets ul {
    box-sizing: content-box;
    clear: both;
    margin: 15px auto 0;
    padding: 0;
    display: inline-block
}

.introjs-bullets ul li {
    box-sizing: content-box;
    list-style: none;
    float: left;
    margin: 0 2px
}

.introjs-bullets ul li a {
    box-sizing: content-box;
    display: block;
    width: 6px;
    height: 6px;
    background: #ccc;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    text-decoration: none;
    cursor: pointer
}

.introjs-bullets ul li a.active, .introjs-bullets ul li a:hover {
    background: #999
}

.introjs-progress {
    box-sizing: content-box;
    overflow: hidden;
    height: 10px;
    margin: 10px 0 5px;
    border-radius: 4px;
    background-color: #ecf0f1
}

.introjs-progressbar {
    box-sizing: content-box;
    float: left;
    width: 0;
    height: 100%;
    font-size: 10px;
    line-height: 10px;
    text-align: center;
    background-color: #08c
}

.introjsFloatingElement {
    position: absolute;
    height: 0;
    width: 0;
    left: 50%;
    top: 50%
}

.introjs-fixedTooltip {
    position: fixed
}

.introjs-hint {
    box-sizing: content-box;
    position: absolute;
    background: transparent;
    width: 20px;
    height: 15px;
    cursor: pointer
}

.introjs-hint:focus {
    border: 0;
    outline: 0
}

.introjs-hidehint {
    display: none
}

.introjs-fixedhint {
    position: fixed
}

.introjs-hint:hover > .introjs-hint-pulse {
    border: 5px solid rgba(60, 60, 60, .57)
}

.introjs-hint-pulse {
    box-sizing: content-box;
    width: 10px;
    height: 10px;
    border: 5px solid rgba(60, 60, 60, .27);
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    background-color: hsla(0, 0%, 53%, .24);
    z-index: 10;
    position: absolute;
    -webkit-transition: all .2s ease-out;
    -moz-transition: all .2s ease-out;
    -ms-transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out
}

.introjs-hint-no-anim .introjs-hint-dot {
    -webkit-animation: none;
    -moz-animation: none;
    animation: none
}

.introjs-hint-dot {
    box-sizing: content-box;
    border: 10px solid hsla(0, 0%, 57%, .36);
    background: transparent;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    border-radius: 60px;
    height: 50px;
    width: 50px;
    -webkit-animation: introjspulse 3s ease-out;
    -moz-animation: introjspulse 3s ease-out;
    animation: introjspulse 3s ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    position: absolute;
    top: -25px;
    left: -25px;
    z-index: 1;
    opacity: 0
}

@-webkit-keyframes introjspulse {
    0% {
        -webkit-transform: scale(0);
        opacity: 0
    }
    25% {
        -webkit-transform: scale(0);
        opacity: .1
    }
    50% {
        -webkit-transform: scale(.1);
        opacity: .3
    }
    75% {
        -webkit-transform: scale(.5);
        opacity: .5
    }
    to {
        -webkit-transform: scale(1);
        opacity: 0
    }
}

@-moz-keyframes introjspulse {
    0% {
        -moz-transform: scale(0);
        opacity: 0
    }
    25% {
        -moz-transform: scale(0);
        opacity: .1
    }
    50% {
        -moz-transform: scale(.1);
        opacity: .3
    }
    75% {
        -moz-transform: scale(.5);
        opacity: .5
    }
    to {
        -moz-transform: scale(1);
        opacity: 0
    }
}

@keyframes introjspulse {
    0% {
        transform: scale(0);
        opacity: 0
    }
    25% {
        transform: scale(0);
        opacity: .1
    }
    50% {
        transform: scale(.1);
        opacity: .3
    }
    75% {
        transform: scale(.5);
        opacity: .5
    }
    to {
        transform: scale(1);
        opacity: 0
    }
}

@font-face {
    font-family: iconfont;
    src: url("//at.alicdn.com/t/font_138257_4hg71fuoozk9be29.eot");
    src: url("//at.alicdn.com/t/font_138257_4hg71fuoozk9be29.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_138257_4hg71fuoozk9be29.woff") format("woff"), url("//at.alicdn.com/t/font_138257_4hg71fuoozk9be29.ttf") format("truetype"), url("//at.alicdn.com/t/font_138257_4hg71fuoozk9be29.svg#iconfont") format("svg")
}

[class*=" icon-"], [class^=icon-] {
    background-image: none;
    margin-right: 0;
    width: auto;
    height: auto
}

.iconfont {
    font-family: iconfont !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: .2px;
    -moz-osx-font-smoothing: grayscale
}

.iconfont-unknow:before {
    content: "?"
}

.icon-log:before {
    content: "\E6F3"
}

.icon-implement:before {
    content: "\E71C"
}

.icon-mail:before {
    content: "\E605"
}

.icon-date:before {
    content: "\E69F"
}

.icon-save:before {
    content: "\E6E2"
}

.icon-saveas:before {
    content: "\E6E3"
}

.icon-open:before {
    content: "\E6A2"
}

.icon-publish:before {
    content: "\E718"
}

.icon-table:before {
    content: "\E65F"
}

.icon-picture:before {
    content: "\E62D"
}

.icon-chart:before {
    content: "\E667"
}

.icon-cubedesigner:before {
    content: "\E6A4"
}

.icon-arraw-left:before {
    content: "\E670"
}

.icon-arraw-right:before {
    content: "\E66F"
}

.icon-right:before {
    content: "\E6A7"
}

.icon-left:before {
    content: "\E6A6"
}

.icon-top:before {
    content: "\E67E"
}

.icon-bottom:before {
    content: "\E67F"
}

.icon-fx:before {
    content: "\E6A5"
}

.icon-bold:before {
    content: "\E634"
}

.icon-italic:before {
    content: "\E638"
}

.icon-underline:before {
    content: "\E644"
}

.icon-overline:before {
    content: "\E64B"
}

.icon-border-all:before {
    content: "\E63F"
}

.icon-border-outer:before {
    content: "\E640"
}

.icon-border-none:before {
    content: "\E642"
}

.icon-border-top:before {
    content: "\E63C"
}

.icon-border-bottom:before {
    content: "\E643"
}

.icon-border-left:before {
    content: "\E652"
}

.icon-border-right:before {
    content: "\E647"
}

.icon-border-inner:before {
    content: "\E64C"
}

.icon-border-inner-h:before {
    content: "\E64A"
}

.icon-border-inner-v:before {
    content: "\E64D"
}

.icon-align-left:before {
    content: "\E653"
}

.icon-align-center:before {
    content: "\E636"
}

.icon-align-right:before {
    content: "\E648"
}

.icon-valign-top:before {
    content: "\E6AA"
}

.icon-valign-middle:before {
    content: "\E6A9"
}

.icon-valign-bottom:before {
    content: "\E6A8"
}

.icon-indent-increase:before {
    content: "\E63E"
}

.icon-indent-decrease:before {
    content: "\E639"
}

.icon-warp:before {
    content: "\E64F"
}

.icon-merge:before {
    content: "\E631"
}

.icon-insert-row:before {
    content: "\E62C"
}

.icon-insert-col:before {
    content: "\E62B"
}

.icon-remove-row:before {
    content: "\E63B"
}

.icon-remove-col:before {
    content: "\E63A"
}

.icon-fit-row:before {
    content: "\E651"
}

.icon-fit-col:before {
    content: "\E650"
}

.icon-hide-row:before {
    content: "\E6AC"
}

.icon-hide-col:before {
    content: "\E6AB"
}

.icon-fix-row:before {
    content: "\E6BB"
}

.icon-fix-col:before {
    content: "\E6BA"
}

.icon-fix-none:before {
    content: "\E6BC"
}

.icon-format-persent:before {
    content: "\E6AD"
}

.icon-format-separator:before {
    content: "\E6AE"
}

.icon-format-decimal-increase:before {
    content: "\E6B0"
}

.icon-format-decimal-decrease:before {
    content: "\E6AF"
}

.icon-remove:before {
    content: "\E613"
}

.icon-error:before {
    content: "\E6FC"
}

.icon-success:before {
    content: "\E6FA"
}

.icon-question:before {
    content: "\E6FD"
}

.icon-info:before {
    content: "\E6FE"
}

.icon-warning:before {
    content: "\E6FB"
}

.icon-arraw-up:before {
    content: "\E6EC"
}

.icon-arraw-level:before {
    content: "\E619"
}

.icon-arraw-down:before {
    content: "\E6ED"
}

.icon-more:before {
    content: "\E697"
}

.icon-line:before {
    content: "\E66C"
}

.icon-bar:before {
    content: "\E667"
}

.icon-area:before {
    content: "\E672"
}

.icon-arrow-r:before {
    content: "\E6B5"
}

.icon-dblarrow-r:before {
    content: "\E6B8"
}

.icon-arrow-l:before {
    content: "\E6B6"
}

.icon-dblarrow-l:before {
    content: "\E6B9"
}

.icon-dblarrow-d:before {
    content: "\E73D"
}

.icon-dblarrow-u:before {
    content: "\E73D";
    transform: rotate(180deg);
    display: inline-block;
    line-height: 1rem
}

.icon-arrow-u:before {
    content: "\E680"
}

.icon-arrow-d:before {
    content: "\E681"
}

.icon-download:before {
    content: "\E6BD"
}

.icon-sort:before {
    content: "\E6C2"
}

.icon-add:before {
    content: "\E696"
}

.icon-permit:before {
    content: ""
}

.icon-edit:before {
    content: "\E686"
}

.icon-preview:before {
    content: "\E691"
}

.icon-exitpreview:before {
    content: "\E646"
}

.icon-fullscreen:before {
    content: "\E66D"
}

.icon-back:before {
    content: "\E6D0"
}

.icon-fresh:before {
    content: "\E6B1"
}

.icon-join-inner:before {
    content: "\E6E0"
}

.icon-join-left:before {
    content: "\E6E9"
}

.icon-search:before {
    content: "\E614"
}

.icon-movable:before {
    content: "\E789"
}

.icon-true:before {
    content: "\E6D2"
}

.icon-delete:before {
    content: "\E61D"
}

.icon-new:before {
    content: "\E6D7"
}

.icon-hierarchy:before {
    content: "\E748"
}

.icon-out:before {
    content: "\E6D5"
}

.icon-change-v:before {
    content: "\E6EF"
}

.icon-change-h:before {
    content: "\E6D3"
}

.icon-loading:before {
    content: "\E603"
}

.icon-sum:before {
    content: "\E810"
}

.icon-close-x:before {
    content: "\E71E"
}

.icon-folder-close:before {
    content: "\E6F1"
}

.icon-close:before {
    content: "\E6DC"
}

.icon-open:before {
    content: "\E6DD"
}

.icon-database-reset:before {
    content: "\E6E7"
}

.icon-table:before {
    content: "\E6D9"
}

.icon-string:before {
    content: "\E809"
}

.icon-datetime:before {
    content: "\E807"
}

.icon-number:before {
    content: "\E796"
}

.icon-location:before {
    content: "\E6D8"
}

.icon-calc:before {
    content: "\E6E1"
}

.icon-config:before {
    content: "\E6BE"
}

.icon-msg:before {
    content: "\E725"
}

.icon-msg-mobile:before {
    content: "\E73B"
}

.icon-common-head-help:before {
    content: "\E72B"
}

.icon-common-head-help-doc:before {
    content: "\E72D"
}

.icon-common-head-help-video:before {
    content: "\E72E"
}

.icon-common-head-help-forum:before {
    content: "\E72C"
}

.icon-dim:before {
    content: "\E6E5"
}

.icon-measure:before {
    content: "\E6E6"
}

.icon-copy:before {
    content: "\E62F"
}

.icon-formatnumber:before {
    content: "\E6EE"
}

.icon-dashboard:before {
    content: "\E6DE"
}

.icon-worksheet-mobile:before {
    content: "\E740"
}

.icon-dashboard-mobile:before {
    content: "\E73C"
}

.icon-dashboard-classic:before {
    content: "\E730"
}

.icon-worksheet:before {
    content: "\E792"
}

.icon-worksheet-classic:before {
    content: "\E72F"
}

.icon-help:before {
    content: "\E6FD"
}

.icon-person:before {
    content: "\E6F8"
}

.icon-mark:before {
    content: "\E7AF"
}

.icon-down:before {
    content: "\E681"
}

.icon-up:before {
    content: "\E680"
}

.icon-optimise:before {
    content: "\E6F2"
}

.icon-group:before {
    content: "\E6F7"
}

.icon-admin:before {
    content: "\E6F6"
}

.icon-user:before {
    content: "\E690"
}

.icon-home:before {
    content: "\E738"
}

.icon--mobile:before {
    content: "\E73B"
}

.icon-my-mobile:before {
    content: "\E73A"
}

.iconfont.invalid {
    color: #dcdcdc
}

.iconfont.valid {
    color: #00c1de
}

.icon-newtag:before {
    content: "\E60B"
}

.icon-ellipsis:before {
    content: "\E6A0"
}

.icon-list:before {
    content: "\E694"
}

.icon-filter:before {
    content: "\E67D"
}

.icon-sort-up:before {
    content: "\E60E"
}

.icon-sort-down:before {
    content: "\E6B4"
}

.icon-sort-none:before {
    content: "\E6B3"
}

.icon-share:before {
    content: "\E600"
}

.icon-classic:before {
    content: "\E601"
}

.icon-select:before {
    content: "\E6A1"
}

.icon-delete2:before {
    content: "\E610"
}

.icon-add2:before {
    content: "\E60F"
}

.icon-intro:before {
    content: "\E6D1"
}

.icon-cancellink:before {
    content: "\E716"
}

.icon-clickme:before {
    content: "\E6FF"
}

.icon-rise:before {
    content: "\E617"
}

.icon-reduce:before {
    content: "\E618"
}

.icon-normal:before {
    content: "\E701"
}

.icon-circle:before {
    content: "\E700"
}

.icon-countd:before, .icon-distinct-count:before {
    content: "\E708"
}

.icon-count:before {
    content: "\E707"
}

.icon-sum:before {
    content: "\E706"
}

.icon-avg:before {
    content: "\E704"
}

.icon-max:before {
    content: "\E705"
}

.icon-min:before {
    content: "\E703"
}

.icon-null:before {
    content: "\E70A"
}

.icon-empty:before {
    content: ""
}

.icon-data:before {
    content: "\E7C1"
}

.icon-view:before {
    content: "\E70B"
}

.icon-setup:before {
    content: "\E70C"
}

.icon-guage:before {
    content: "\E6F5"
}

.icon-datasource:before {
    content: "\E625"
}

.icon-change-hv:before {
    content: "\E6D4"
}

.icon-SQLshujuji:before {
    content: "\E71B"
}

.icon-cube:before {
    content: "\E722"
}

.icon-rename:before {
    content: "\E71D"
}

.icon-dashboard:before {
    content: "\E720"
}

.icon-worksheet:before {
    content: "\E71F"
}

.icon-move:before {
    content: "\E728"
}

.icon-share:before {
    content: "\E729"
}

.icon-row-permission:before {
    content: "\E621"
}

.icon-edit:before {
    content: "\E61B"
}

.icon-suodingshujuji:before {
    content: "\E724"
}

.icon-tuceng:before {
    content: "\E70D"
}

.icon-folder:before {
    content: "\E6F1"
}

.icon-folder-open:before {
    content: "\E6F0"
}

.icon-transfer:before {
    content: "\E6D5"
}

.icon-move-to:before {
    content: "\E728"
}

.icon-more-operation:before {
    content: "\E723"
}

.icon-double-arrow-down:before {
    content: "\E812"
}

.icon-double-arrow-up:before {
    content: "\E811"
}

.icon-dashboard-mode-normal:before {
    content: "\E736"
}

.icon-dashboard-mode-fullscreen:before {
    content: "\E737"
}

.icon-clear:before {
    content: "\E73E"
}

.icon-manual-input:before {
    content: "\E73F"
}

/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary {
    display: block
}

audio, canvas, progress, video {
    display: inline-block
}

audio:not([controls]) {
    display: none;
    height: 0
}

progress {
    vertical-align: baseline
}

[hidden], template {
    display: none
}

a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}

a:active, a:hover {
    outline-width: 0
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
}

b, strong {
    font-weight: inherit;
    font-weight: bolder
}

dfn {
    font-style: italic
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

mark {
    background-color: #ff0;
    color: #000
}

small {
    font-size: 80%
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none
}

svg:not(:root) {
    overflow: hidden
}

code, kbd, pre, samp {
    font-family: monospace, monospace;
    font-size: 1em
}

figure {
    margin: 1em 40px
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

button, input, optgroup, select, textarea {
    font: inherit;
    margin: 0
}

optgroup {
    font-weight: 700
}

button, input {
    overflow: visible
}

button, select {
    text-transform: none
}

[type=reset], [type=submit], button, html [type=button] {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

textarea {
    overflow: auto
}

[type=checkbox], [type=radio] {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-cancel-button, [type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-input-placeholder {
    color: inherit;
    opacity: .54
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

*, :after, :before {
    box-sizing: inherit
}

html {
    box-sizing: border-box;
    font-size: 10px;
    -webkit-tap-highlight-color: transparent
}

body {
    color: #333;
    font-family: Microsoft YaHei
}

.disabled, [disabled] {
    cursor: default;
    opacity: .5;
    pointer-events: none
}

ol, ul {
    margin: 0;
    padding-left: 0;
    list-style: none
}

.pull-left {
    float: left
}

.pull-right {
    float: right
}

.kui-absolute {
    position: absolute
}

.kui-relative {
    position: relative
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

.clearfix {
    *height: 1%
}

@media screen and (min-width: 981px) {
    .grid-960 {
        margin-left: auto;
        margin-right: auto;
        width: 96rem
    }
}

@media screen and (min-width: 481px) {
    .grid-480 {
        margin-left: auto;
        margin-right: auto;
        width: 48rem
    }
}

.columns {
    display: block;
    position: relative
}

.column {
    flex: 1;
    padding: .5rem
}

.column.col-1, .column.col-2, .column.col-3, .column.col-4, .column.col-5, .column.col-6, .column.col-7, .column.col-8, .column.col-9, .column.col-10, .column.col-11, .column.col-12 {
    flex: none;
    float: left
}

@media screen and (min-width: 841px) {
    .columns {
        display: flex
    }

    .col-12 {
        width: 100%
    }

    .col-11 {
        width: 91.66666667%
    }

    .col-10 {
        width: 83.33333333%
    }

    .col-9 {
        width: 75%
    }

    .col-8 {
        width: 66.66666667%
    }

    .col-7 {
        width: 58.33333333%
    }

    .col-6 {
        width: 50%
    }

    .col-5 {
        width: 41.66666667%
    }

    .col-4 {
        width: 33.33333333%
    }

    .col-3 {
        width: 25%
    }

    .col-2 {
        width: 16.66666667%
    }

    .col-1 {
        width: 8.33333333%
    }
}

@media screen and (min-width: 481px) and (max-width: 840px) {
    .columns {
        display: flex;
        flex-wrap: wrap
    }

    .col-12 {
        width: 100%
    }

    .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11 {
        width: 50%
    }
}

@media screen and (max-width: 480px) {
    .hide-xs {
        display: none !important
    }
}

@media screen and (max-width: 600px) {
    .hide-sm {
        display: none !important
    }
}

@media screen and (max-width: 840px) {
    .hide-md {
        display: none !important
    }
}

@media screen and (max-width: 960px) {
    .hide-lg {
        display: none !important
    }
}

@media screen and (max-width: 1280px) {
    .hide-xl {
        display: none !important
    }
}

.btn-analysis {
    -webkit-appearance: none;
    background-color: transparent;
    border-radius: 4px;
    color: #fff;
    background-color: #00c1de;
    border: none;
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    height: 38px;
    line-height: 12px;
    outline: 0;
    padding: 7px 16px;
    text-align: center;
    text-decoration: none;
    user-select: none;
    -webkit-user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    position: relative;
    overflow: hidden
}

.btn-analysis:after {
    content: "";
    background: hsla(0, 0%, 100%, .3);
    display: block;
    position: absolute;
    border-radius: 50%;
    padding-top: 240%;
    padding-left: 240%;
    margin-top: -120%;
    margin-left: -120%;
    opacity: 0;
    transition: all 1s
}

.btn-analysis:active:after {
    padding-top: 0;
    padding-left: 0;
    margin-top: 0;
    margin-left: 0;
    opacity: 1;
    transition: 0s
}

.btn-analysis.btn-sm {
    border-radius: 2px;
    font-size: 12px;
    height: 24px;
    line-height: 14px;
    padding: 4px 18px
}

.btn-analysis.btn-lg {
    border-radius: 4px;
    font-size: 18px;
    height: 42px;
    line-height: 20px;
    padding: 10px 18px
}

.btn-analysis.btn-white {
    background-color: #fff !important;
    color: #333;
    border: 1px solid #c6c6c6
}

.btn-analysis.btn-white:hover {
    background-color: #f2f2f2;
    color: #333 !important
}

.btn-group {
    font-size: 0
}

.btn-group .btn-analysis:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px
}

.btn-group .btn-analysis:last-child {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

.btn-group > .btn {
    padding: 2px 8px !important;
    border-left: none;
    float: none;
    border-radius: 0
}

.btn-group .btn-analysis.btn-white:first-child {
    border-left: 1px solid #c6c6c6
}

.btn-group .btn-analysis.active {
    background: #09c;
    border-right: 1px solid #fff;
    color: #fff
}

.btn-hover, .btn-analysis:focus, .btn-analysis:hover {
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(40%, rgba(0, 0, 0, .05)), to(rgba(0, 0, 0, .1)));
    background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, .05) 40%, rgba(0, 0, 0, .1));
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, .05) 0, rgba(0, 0, 0, .1));
    background-image: -o-linear-gradient(transparent, rgba(0, 0, 0, .05) 40%, rgba(0, 0, 0, .1));
    background-image: linear-gradient(transparent, rgba(0, 0, 0, .05) 40%, rgba(0, 0, 0, .1))
}

.btn-analysis:focus {
    outline: 0
}

.btn-active, .btn-analysis:active {
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15), inset 0 0 6px rgba(0, 0, 0, .2);
    border-color: #def2f5
}

.btn-disabled, .btn-disabled:active, .btn-disabled:focus, .btn-disabled:hover, .btn[disabled] {
    border: none;
    background-image: none;
    filter: alpha(opacity=40);
    -khtml-opacity: .4;
    -moz-opacity: .4;
    opacity: .4;
    cursor: not-allowed;
    box-shadow: none
}

.btn-hidden {
    display: none
}

.btn-analysis::-moz-focus-inner {
    padding: 0;
    border: 0
}

.btn-primary, .btn-selected, a.btn-primary, a.btn-selected {
    background-color: #0078e7;
    color: #fff
}

.btn-error, .btn-secondary, .btn-success, .btn-warning {
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .2)
}

.btn-success {
    background: #1cb841
}

.btn-error {
    background: #ca3c3c
}

.btn-warning {
    background: #df7514
}

.btn-secondary {
    background: #42b8dd
}

@media screen and (min-width: 841px) {
    .form-horizontal {
        padding: 1rem
    }

    .form-horizontal .form-group {
        display: flex
    }

    .form-horizontal .form-label {
        padding: .8rem .4rem
    }

    .form-horizontal .form-checkbox, .form-horizontal .form-radio {
        margin: .5rem 0
    }
}

@media screen and (max-width: 840px) {
    .form-horizontal .col-1, .form-horizontal .col-2, .form-horizontal .col-3, .form-horizontal .col-4, .form-horizontal .col-5, .form-horizontal .col-6, .form-horizontal .col-7, .form-horizontal .col-8, .form-horizontal .col-9, .form-horizontal .col-10, .form-horizontal .col-11, .form-horizontal .col-12 {
        width: 100%
    }
}

.form-input {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 32px;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ddd;
    color: #666;
    font-size: 12px;
    line-height: 32px;
    padding: 4px 6px;
    -webkit-appearance: none;
    outline: 0
}

.form-input:focus {
    color: #333;
    border-color: #00aafb;
    box-shadow: 0 0 2px 0 #00aafb
}

.form-input[disabled] {
    background-color: #eeeff2
}

.form-input.input-sm {
    height: 24px;
    border-radius: 4px;
    font-size: 12px;
    padding: 0 4px
}

.form-input.input-lg {
    height: 4.2rem;
    border-radius: .4rem;
    font-size: 1.6rem;
    padding: 1rem 1.2rem
}

.form-input.input-inline {
    width: auto;
    display: inline-block
}

textarea.form-input {
    height: auto;
    line-height: 2rem
}

.form-input.is-danger, .form-input.is-success, .has-danger .form-input, .has-success .form-input {
    border-color: #ddd
}

.form-label {
    display: block;
    line-height: 30px
}

.form-select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
    min-width: 80px
}

.form-select select::-ms-expand {
    display: none
}

.form-select:not([multiple]) {
    height: 32px;
    font-size: 14px;
    vertical-align: middle;
    padding: 6px;
    border: 1px solid #ddd;
    outline: 0;
    background: #fff url() 100% no-repeat
}

.form-select:focus {
    border-color: #666
}

.form-select::-ms-expand {
    display: none
}

.form-select.select-sm {
    height: 2.4rem;
    border-radius: .2rem;
    font-size: 1.2rem;
    padding: .4rem .6rem
}

.form-checkbox input, .form-radio input, .form-switch input {
    display: none
}

.form-checkbox, .form-radio {
    line-height: 14px;
    padding: 8px 20px;
    height: 14px;
    cursor: pointer;
    display: inline-block;
    position: relative;
    white-space: nowrap
}

.form-checkbox .form-icon, .form-radio .form-icon {
    font-size: 1.4rem;
    line-height: 2.4rem;
    vertical-align: top;
    border: .1rem solid #00aafb;
    display: inline-block;
    width: 1.4rem;
    height: 1.4rem;
    padding: 0;
    position: absolute;
    top: .5rem;
    left: 0;
    outline: none
}

.form-checkbox:hover .form-icon, .form-radio:hover .form-icon {
    border-color: #b7b7b7
}

.form-checkbox input:checked + .form-icon, .form-radio input:checked + .form-icon {
    background-color: #00aafb;
    border-color: #00aafb
}

.form-checkbox .form-icon {
    border-radius: .2rem
}

.form-checkbox input:checked + .form-icon:after {
    width: .6rem;
    height: 1rem;
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -.6rem;
    margin-left: -.3rem;
    border: .2rem solid #fff;
    border-top-width: 0;
    border-left-width: 0;
    transform: rotate(45deg)
}

.form-radio .form-icon {
    border-radius: .7rem
}

.form-radio input:checked + .form-icon:after {
    width: .4rem;
    height: .4rem;
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -.2rem;
    margin-left: -.2rem;
    border-radius: .2rem;
    background-color: #fff
}

.form-switch {
    line-height: 1.8rem;
    padding: .3rem 2rem .3rem 3.6rem;
    cursor: pointer;
    display: inline-block;
    position: relative
}

.form-switch .form-icon {
    line-height: 2.4rem;
    vertical-align: top;
    border: .1rem solid #e2e5e6;
    background-color: #e2e5e6;
    display: inline-block;
    width: 3rem;
    height: 1.8rem;
    padding: 0;
    border-radius: .9rem;
    position: absolute;
    top: .3rem;
    left: 0;
    outline: none
}

.form-switch .form-icon:after {
    content: "";
    display: block;
    width: 1.4rem;
    height: 1.4rem;
    border-radius: .8rem;
    position: absolute;
    top: .1rem;
    left: .1rem;
    background-color: #fff;
    transition: left .15s ease
}

.form-switch input:checked + .form-icon {
    background-color: #00aafb;
    border-color: #ddd
}

.form-switch input:checked + .form-icon:after {
    left: 1.3rem
}

.input-group {
    display: flex
}

.input-group .input-group-addon {
    line-height: 1.6rem;
    padding: .7rem .8rem;
    border: .1rem solid #ddd;
    border-radius: .3rem;
    background-color: #ddd
}

.input-group .input-group-addon, .input-group .input-group-btn {
    flex: 1 0 auto
}

.input-group .form-input:first-child:not(:last-child), .input-group .input-group-addon:first-child:not(:last-child), .input-group .input-group-btn:first-child:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.input-group .form-input:not(:first-child):not(:last-child), .input-group .input-group-addon:not(:first-child):not(:last-child), .input-group .input-group-btn:not(:first-child):not(:last-child) {
    margin-left: -.1rem;
    border-radius: 0
}

.input-group .form-input:last-child:not(:first-child), .input-group .input-group-addon:last-child:not(:first-child), .input-group .input-group-btn:last-child:not(:first-child) {
    margin-left: -.1rem;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.input-group .form-input:focus, .input-group .input-group-addon:focus, .input-group .input-group-btn:focus {
    z-index: 99
}

.kui-group {
    border: 1px solid #ccd6e0
}

.kui-group .kui-group-title {
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    padding-left: 10px;
    background: #f8f9fb;
    border-bottom: 1px solid #ccd6e0
}

.kui-group .kui-group-body {
    padding: 10px 20px
}

a {
    color: #666;
    text-decoration: none
}

a.oper {
    cursor: pointer;
    color: #00c1de
}

.table {
    border-collapse: collapse;
    border-spacing: 0;
    empty-cells: show;
    border: 1px solid #cbcbcb
}

.table caption {
    color: #000;
    font: italic 85%/1 arial, sans-serif;
    padding: 12px 0;
    text-align: center
}

.table td, .table th {
    border-left: 1px solid #cbcbcb;
    border-width: 0 0 0 1px;
    font-size: inherit;
    margin: 0;
    overflow: visible;
    padding: 10px 20px
}

.table td:first-child, .table th:first-child {
    border-left-width: 0
}

.table thead {
    background-color: #e0e0e0;
    color: #000;
    text-align: left;
    vertical-align: bottom
}

.table td {
    background-color: transparent
}

.table-odd td, .table-striped tr:nth-child(2n-1) td {
    background-color: #f2f2f2
}

.table-bordered td {
    border-bottom: 1px solid #cbcbcb
}

.table-bordered tbody > tr:last-child > td {
    border-bottom-width: 0
}

.table-horizontal td, .table-horizontal th {
    border-width: 0 0 1px;
    border-bottom: 1px solid #cbcbcb
}

.table-horizontal tbody > tr:last-child > td {
    border-bottom-width: 0
}

.float-left {
    float: left !important
}

.float-right {
    float: right !important
}

.rel {
    position: relative
}

.abs {
    position: absolute
}

.fixed {
    position: fixed
}

.centered {
    display: block;
    float: none;
    margin-left: auto;
    margin-right: auto
}

.mt-10 {
    margin-top: 1rem
}

.mr-10 {
    margin-right: 1rem
}

.mb-10 {
    margin-bottom: 1rem
}

.ml-10 {
    margin-left: 1rem
}

.mt-5 {
    margin-top: .5rem
}

.mr-5 {
    margin-right: .5rem
}

.mb-5 {
    margin-bottom: .5rem
}

.ml-5 {
    margin-left: .5rem
}

.pt-10 {
    padding-top: 1rem
}

.pr-10 {
    padding-right: 1rem
}

.pb-10 {
    padding-bottom: 1rem
}

.pl-10 {
    padding-left: 1rem
}

.pt-5 {
    padding-top: .5rem
}

.pr-5 {
    padding-right: .5rem
}

.pb-5 {
    padding-bottom: .5rem
}

.pl-5 {
    padding-left: .5rem
}

.block {
    display: block
}

.inline {
    display: inline
}

.inline-block {
    display: inline-block
}

.flex {
    display: flex
}

.inline-flex {
    display: inline-flex
}

.hide {
    display: none
}

.visible {
    visibility: visible
}

.invisible {
    visibility: hidden
}

.text-hide {
    background-color: transparent;
    border: 0;
    color: transparent;
    font: 0/0 a;
    text-shadow: none
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

.text-center {
    text-align: center
}

.text-justify {
    text-align: justify
}

.text-lowercase {
    text-transform: lowercase
}

.text-uppercase {
    text-transform: uppercase
}

.text-capitalize {
    text-transform: capitalize
}

.text-normal {
    font-weight: 400
}

.text-bold {
    font-weight: 700
}

.text-italic {
    font-style: italic
}

.text-ellipsis {
    text-overflow: ellipsis
}

.text-clip, .text-ellipsis {
    overflow: hidden;
    white-space: nowrap
}

.text-clip {
    text-overflow: clip
}

.text-break {
    hyphens: auto;
    word-break: break-word;
    word-wrap: break-word
}

.hand {
    cursor: pointer
}

.shadow {
    box-shadow: 0 .1rem .4rem rgba(0, 0, 0, .3)
}

.light-shadow {
    box-shadow: 0 .1rem .2rem rgba(0, 0, 0, .15)
}

.kui-disabled {
    color: #ccc
}

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */
.animated {
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.animated.hinge {
    -webkit-animation-duration: 2s;
    animation-duration: 2s
}

.animated.bounceIn, .animated.bounceOut, .animated.flipOutX, .animated.flipOutY {
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}

@-webkit-keyframes bounce {
    0%, 20%, 53%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    40%, 43% {
        -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0)
    }
    70% {
        -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0)
    }
}

@keyframes bounce {
    0%, 20%, 53%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    40%, 43% {
        -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0)
    }
    70% {
        -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0)
    }
}

.bounce {
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom
}

@-webkit-keyframes flash {
    0%, 50%, to {
        opacity: 1
    }
    25%, 75% {
        opacity: 0
    }
}

@keyframes flash {
    0%, 50%, to {
        opacity: 1
    }
    25%, 75% {
        opacity: 0
    }
}

.flash {
    -webkit-animation-name: flash;
    animation-name: flash
}

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes pulse {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse
}

@-webkit-keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    30% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    40% {
        -webkit-transform: scale3d(.75, 1.25, 1);
        transform: scale3d(.75, 1.25, 1)
    }
    50% {
        -webkit-transform: scale3d(1.15, .85, 1);
        transform: scale3d(1.15, .85, 1)
    }
    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    30% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    40% {
        -webkit-transform: scale3d(.75, 1.25, 1);
        transform: scale3d(.75, 1.25, 1)
    }
    50% {
        -webkit-transform: scale3d(1.15, .85, 1);
        transform: scale3d(1.15, .85, 1)
    }
    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand
}

@-webkit-keyframes shake {
    0%, to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}

@keyframes shake {
    0%, to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}

.shake {
    -webkit-animation-name: shake;
    animation-name: shake
}

@-webkit-keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg)
    }
    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg)
    }
    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg)
    }
    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg)
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg)
    }
    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg)
    }
    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg)
    }
    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg)
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.headShake {
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-name: headShake;
    animation-name: headShake
}

@-webkit-keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }
    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }
    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }
    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }
    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }
    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }
    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }
    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }
    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.swing {
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing
}

@-webkit-keyframes tada {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    10%, 20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
        transform: scale3d(.9, .9, .9) rotate(-3deg)
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
    }
    40%, 60%, 80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes tada {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    10%, 20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
        transform: scale3d(.9, .9, .9) rotate(-3deg)
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
    }
    40%, 60%, 80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.tada {
    -webkit-animation-name: tada;
    animation-name: tada
}

@-webkit-keyframes wobble {
    0% {
        -webkit-transform: none;
        transform: none
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
        transform: translate3d(-25%, 0, 0) rotate(-5deg)
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
        transform: translate3d(20%, 0, 0) rotate(3deg)
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
        transform: translate3d(-15%, 0, 0) rotate(-3deg)
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
        transform: translate3d(10%, 0, 0) rotate(2deg)
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
        transform: translate3d(-5%, 0, 0) rotate(-1deg)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes wobble {
    0% {
        -webkit-transform: none;
        transform: none
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
        transform: translate3d(-25%, 0, 0) rotate(-5deg)
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
        transform: translate3d(20%, 0, 0) rotate(3deg)
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
        transform: translate3d(-15%, 0, 0) rotate(-3deg)
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
        transform: translate3d(10%, 0, 0) rotate(2deg)
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
        transform: translate3d(-5%, 0, 0) rotate(-1deg)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

.wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble
}

@-webkit-keyframes jello {
    0%, 11.1%, to {
        -webkit-transform: none;
        transform: none
    }
    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }
    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg)
    }
    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }
    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }
    66.6% {
        -webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }
    77.7% {
        -webkit-transform: skewX(.390625deg) skewY(.390625deg);
        transform: skewX(.390625deg) skewY(.390625deg)
    }
    88.8% {
        -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

@keyframes jello {
    0%, 11.1%, to {
        -webkit-transform: none;
        transform: none
    }
    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }
    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg)
    }
    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }
    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }
    66.6% {
        -webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }
    77.7% {
        -webkit-transform: skewX(.390625deg) skewY(.390625deg);
        transform: skewX(.390625deg) skewY(.390625deg)
    }
    88.8% {
        -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

.jello {
    -webkit-animation-name: jello;
    animation-name: jello;
    -webkit-transform-origin: center;
    transform-origin: center
}

@-webkit-keyframes bounceIn {
    0%, 20%, 40%, 60%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    to {
        opacity: 1;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes bounceIn {
    0%, 20%, 40%, 60%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    to {
        opacity: 1;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.bounceIn {
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn
}

@-webkit-keyframes bounceInDown {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -3000px, 0);
        transform: translate3d(0, -3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInDown {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -3000px, 0);
        transform: translate3d(0, -3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

.bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown
}

@-webkit-keyframes bounceInLeft {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0);
        transform: translate3d(25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInLeft {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0);
        transform: translate3d(25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft
}

@-webkit-keyframes bounceInRight {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0);
        transform: translate3d(-25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInRight {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0);
        transform: translate3d(-25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    to {
        -webkit-transform: none;
        transform: none
    }
}

.bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight
}

@-webkit-keyframes bounceInUp {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInUp {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp
}

@-webkit-keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    50%, 55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
}

@keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    50%, 55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
}

.bounceOut {
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut
}

@-webkit-keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}

@keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}

.bounceOutDown {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown
}

@-webkit-keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}

@keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}

.bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft
}

@-webkit-keyframes bounceOutRight {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}

@keyframes bounceOutRight {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}

.bounceOutRight {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight
}

@-webkit-keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}

@keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}

.bounceOutUp {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown
}

@-webkit-keyframes fadeInDownBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInDownBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInDownBig {
    -webkit-animation-name: fadeInDownBig;
    animation-name: fadeInDownBig
}

@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft
}

@-webkit-keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}

@-webkit-keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}

@-webkit-keyframes fadeInUpBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInUpBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInUpBig {
    -webkit-animation-name: fadeInUpBig;
    animation-name: fadeInUpBig
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

.fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut
}

@-webkit-keyframes fadeOutDown {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
}

@keyframes fadeOutDown {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
}

.fadeOutDown {
    -webkit-animation-name: fadeOutDown;
    animation-name: fadeOutDown
}

@-webkit-keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}

@keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}

.fadeOutDownBig {
    -webkit-animation-name: fadeOutDownBig;
    animation-name: fadeOutDownBig
}

@-webkit-keyframes fadeOutLeft {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}

@keyframes fadeOutLeft {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft
}

@-webkit-keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}

@keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}

.fadeOutLeftBig {
    -webkit-animation-name: fadeOutLeftBig;
    animation-name: fadeOutLeftBig
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

.fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight
}

@-webkit-keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}

@keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}

.fadeOutRightBig {
    -webkit-animation-name: fadeOutRightBig;
    animation-name: fadeOutRightBig
}

@-webkit-keyframes fadeOutUp {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
}

@keyframes fadeOutUp {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
}

.fadeOutUp {
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp
}

@-webkit-keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}

@keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}

.fadeOutUpBig {
    -webkit-animation-name: fadeOutUpBig;
    animation-name: fadeOutUpBig
}

@-webkit-keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotateY(-1turn);
        transform: perspective(400px) rotateY(-1turn);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    40% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
        transform: perspective(400px) translateZ(150px) rotateY(-190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    50% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
        transform: perspective(400px) translateZ(150px) rotateY(-170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    80% {
        -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
        transform: perspective(400px) scale3d(.95, .95, .95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

@keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotateY(-1turn);
        transform: perspective(400px) rotateY(-1turn);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    40% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
        transform: perspective(400px) translateZ(150px) rotateY(-190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    50% {
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
        transform: perspective(400px) translateZ(150px) rotateY(-170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    80% {
        -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
        transform: perspective(400px) scale3d(.95, .95, .95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

.animated.flip {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-animation-name: flip;
    animation-name: flip
}

@-webkit-keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotateX(10deg);
        transform: perspective(400px) rotateX(10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotateX(-5deg);
        transform: perspective(400px) rotateX(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotateX(10deg);
        transform: perspective(400px) rotateX(10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotateX(-5deg);
        transform: perspective(400px) rotateX(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

.flipInX {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX
}

@-webkit-keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotateY(-20deg);
        transform: perspective(400px) rotateY(-20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotateY(10deg);
        transform: perspective(400px) rotateY(10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotateY(-5deg);
        transform: perspective(400px) rotateY(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotateY(-20deg);
        transform: perspective(400px) rotateY(-20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotateY(10deg);
        transform: perspective(400px) rotateY(10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotateY(-5deg);
        transform: perspective(400px) rotateY(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

.flipInY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInY;
    animation-name: flipInY
}

@-webkit-keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg);
        opacity: 1
    }
    to {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        opacity: 0
    }
}

@keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg);
        opacity: 1
    }
    to {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        opacity: 0
    }
}

.flipOutX {
    -webkit-animation-name: flipOutX;
    animation-name: flipOutX;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important
}

@-webkit-keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateY(-15deg);
        transform: perspective(400px) rotateY(-15deg);
        opacity: 1
    }
    to {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        opacity: 0
    }
}

@keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateY(-15deg);
        transform: perspective(400px) rotateY(-15deg);
        opacity: 1
    }
    to {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        opacity: 0
    }
}

.flipOutY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipOutY;
    animation-name: flipOutY
}

@-webkit-keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }
    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1
    }
    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg);
        opacity: 1
    }
    to {
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }
    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1
    }
    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg);
        opacity: 1
    }
    to {
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
}

@-webkit-keyframes lightSpeedOut {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0
    }
}

@keyframes lightSpeedOut {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0
    }
}

.lightSpeedOut {
    -webkit-animation-name: lightSpeedOut;
    animation-name: lightSpeedOut;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
}

@-webkit-keyframes rotateIn {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate(-200deg);
        transform: rotate(-200deg);
        opacity: 0
    }
    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateIn {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate(-200deg);
        transform: rotate(-200deg);
        opacity: 0
    }
    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateIn {
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn
}

@-webkit-keyframes rotateInDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInDownLeft {
    -webkit-animation-name: rotateInDownLeft;
    animation-name: rotateInDownLeft
}

@-webkit-keyframes rotateInDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInDownRight {
    -webkit-animation-name: rotateInDownRight;
    animation-name: rotateInDownRight
}

@-webkit-keyframes rotateInUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInUpLeft {
    -webkit-animation-name: rotateInUpLeft;
    animation-name: rotateInUpLeft
}

@-webkit-keyframes rotateInUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        opacity: 0
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        opacity: 0
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInUpRight {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight
}

@-webkit-keyframes rotateOut {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1
    }
    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate(200deg);
        transform: rotate(200deg);
        opacity: 0
    }
}

@keyframes rotateOut {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1
    }
    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate(200deg);
        transform: rotate(200deg);
        opacity: 0
    }
}

.rotateOut {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut
}

@-webkit-keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
}

@keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
}

.rotateOutDownLeft {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft
}

@-webkit-keyframes rotateOutDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

@keyframes rotateOutDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

.rotateOutDownRight {
    -webkit-animation-name: rotateOutDownRight;
    animation-name: rotateOutDownRight
}

@-webkit-keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

@keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

.rotateOutUpLeft {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft
}

@-webkit-keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: 0
    }
}

@keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: 0
    }
}

.rotateOutUpRight {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight
}

@-webkit-keyframes hinge {
    0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    20%, 60% {
        -webkit-transform: rotate(80deg);
        transform: rotate(80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    40%, 80% {
        -webkit-transform: rotate(60deg);
        transform: rotate(60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, 700px, 0);
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}

@keyframes hinge {
    0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    20%, 60% {
        -webkit-transform: rotate(80deg);
        transform: rotate(80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    40%, 80% {
        -webkit-transform: rotate(60deg);
        transform: rotate(60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, 700px, 0);
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}

.hinge {
    -webkit-animation-name: hinge;
    animation-name: hinge
}

@-webkit-keyframes rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
        transform: translate3d(-100%, 0, 0) rotate(-120deg)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
        transform: translate3d(-100%, 0, 0) rotate(-120deg)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.rollIn {
    -webkit-animation-name: rollIn;
    animation-name: rollIn
}

@-webkit-keyframes rollOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
        transform: translate3d(100%, 0, 0) rotate(120deg)
    }
}

@keyframes rollOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
        transform: translate3d(100%, 0, 0) rotate(120deg)
    }
}

.rollOut {
    -webkit-animation-name: rollOut;
    animation-name: rollOut
}

@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    50% {
        opacity: 1
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    50% {
        opacity: 1
    }
}

.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn
}

@-webkit-keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInDown {
    -webkit-animation-name: zoomInDown;
    animation-name: zoomInDown
}

@-webkit-keyframes zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInLeft {
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft
}

@-webkit-keyframes zoomInRight {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomInRight {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInRight {
    -webkit-animation-name: zoomInRight;
    animation-name: zoomInRight
}

@-webkit-keyframes zoomInUp {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomInUp {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInUp {
    -webkit-animation-name: zoomInUp;
    animation-name: zoomInUp
}

@-webkit-keyframes zoomOut {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    to {
        opacity: 0
    }
}

@keyframes zoomOut {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    to {
        opacity: 0
    }
}

.zoomOut {
    -webkit-animation-name: zoomOut;
    animation-name: zoomOut
}

@-webkit-keyframes zoomOutDown {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomOutDown {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomOutDown {
    -webkit-animation-name: zoomOutDown;
    animation-name: zoomOutDown
}

@-webkit-keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
        transform: scale(.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center
    }
}

@keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
        transform: scale(.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center
    }
}

.zoomOutLeft {
    -webkit-animation-name: zoomOutLeft;
    animation-name: zoomOutLeft
}

@-webkit-keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
        transform: scale(.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center
    }
}

@keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }
    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
        transform: scale(.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center
    }
}

.zoomOutRight {
    -webkit-animation-name: zoomOutRight;
    animation-name: zoomOutRight
}

@-webkit-keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

@keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomOutUp {
    -webkit-animation-name: zoomOutUp;
    animation-name: zoomOutUp
}

@-webkit-keyframes slideInDown {
    0% {
        -webkit-transform: translate3d(-100%, -100%, 0);
        transform: translate3d(-100%, -100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInDown {
    0% {
        -webkit-transform: translate3d(-100%, -100%, 0);
        transform: translate3d(-100%, -100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown
}

@-webkit-keyframes slideInLeft {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInLeft {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft
}

@-webkit-keyframes slideInRight {
    0% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInRight {
    0% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight
}

@-webkit-keyframes slideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp
}

@-webkit-keyframes slideOutDown {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
}

@keyframes slideOutDown {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
}

.slideOutDown {
    -webkit-animation-name: slideOutDown;
    animation-name: slideOutDown
}

@-webkit-keyframes slideOutLeft {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}

@keyframes slideOutLeft {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}

.slideOutLeft {
    -webkit-animation-name: slideOutLeft;
    animation-name: slideOutLeft
}

@-webkit-keyframes slideOutRight {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

@keyframes slideOutRight {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

.slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight
}

@-webkit-keyframes slideOutUp {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
}

@keyframes slideOutUp {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
}

.slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp
}

.aliyun-container {
    padding: 10px 20px;
    font-family: Microsoft YaHei
}

.aliyun-container .module-title {
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
    margin: 0
}

.aliyun-container .module-title h5 {
    border-left: 2px solid #88b7e0;
    padding-left: 10px;
    margin: 0 0 10px;
    line-height: 20px;
    font-size: 14px
}

a, a:hover {
    color: #00c1de
}

.kui-select {
    position: relative;
    display: inline-block;
    width: 290px;
    height: 30px
}

.kui-select .kui-list ul li {
    text-align: left
}

.kui-select .kui-select-input {
    width: 1000%;
    height: 100%;
    border-radius: 0;
    color: #000;
    padding-right: 20px;
    overflow: hidden;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
    text-align: left;
    font-size: 12px;
    line-height: 28px
}

.kui-select .select-tag {
    color: #666;
    position: absolute;
    right: 6px;
    top: 10px;
    font-size: 12px;
    height: 14px;
    line-height: 14px
}

.kui-select:hover .select-tag {
    top: 10px
}

@keyframes turn {
    to {
        transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg)
    }
}

@keyframes back {
    0% {
        transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg)
    }
    to {
        transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg)
    }
}

.kui-list-container {
    display: none;
    border: 1px solid rgba(0, 0, 0, .15);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    background: #fff;
    position: absolute;
    width: 100%;
    z-index: 9999
}

.kui-suggest input.form-input {
    border-radius: 0;
    border: none;
    height: 24px
}

.kui-select .kui-list {
    margin: 0 -1px;
    overflow: auto
}

.kui-select .kui-list ul {
    overflow: visible;
    float: left;
    min-width: 100%
}

.searchtag {
    position: absolute;
    right: 10px;
    top: 2px;
    font-size: 12px;
    color: #00abfc
}

.searchtag.icon-loading {
    animation: spin 1s infinite linear
}

@keyframes spin {
    0% {
        transform: rotate(1turn)
    }
    50% {
        transform: rotate(180deg)
    }
    to {
        transform: rotate(0deg)
    }
}

.tab-block {
    list-style: none;
    margin: 5px 0;
    border-bottom: .1rem solid #c5c5c5;
    display: flex
}

.tab-block .tab-item {
    margin-bottom: -.1rem;
    margin-top: 0
}

.tab-block .tab-item a {
    border-bottom: .2rem solid transparent;
    color: #333;
    display: block;
    padding: .5rem 1.5rem;
    text-decoration: none
}

.tab-block .tab-item.active a, .tab-block .tab-item a:focus, .tab-block .tab-item a:hover {
    border-bottom-color: #00b450;
    color: #00b450
}

.tab-block .tab-item {
    flex: 1 0 auto;
    text-align: center
}

.tab-block .tab-item .badge[data-badge]:after {
    position: absolute;
    right: 1.5rem;
    top: .6rem;
    transform: translate(50%, -8px)
}

.kui-list {
    border: 1px solid rgba(0, 0, 0, .15);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    background: #fff;
    z-index: 999;
    min-width: 60px;
    position: relative
}

.kui-list-item {
    text-indent: 10px;
    height: 30px;
    padding: 4px 0;
    color: #666;
    cursor: pointer;
    white-space: nowrap
}

.kui-list-item, .kui-list-item .iconfont {
    line-height: 22px
}

.kui-list-item .kui-list-content {
    display: inline-block;
    line-height: 22px
}

.kui-list-item-active {
    line-height: 22px
}

.kui-list .form-checkbox {
    display: block
}

.kui-list .form-checkbox i {
    left: 10px
}

.kui-list .form-checkbox, .kui-list .form-radio {
    padding: 0 12px;
    width: 100%;
    height: 100%
}

.kui-list .form-checkbox .form-icon, .kui-list .form-radio .form-icon {
    top: 2px
}

.kui-list-item:hover {
    background: rgba(149, 213, 249, .25);
    color: #333
}

.kui-list ul {
    min-height: 100%;
    max-height: 200px
}

.kui-list-item-focus {
    background: rgba(149, 213, 249, .25);
    color: #333
}

.kui-list input.searchkey {
    border: none;
    border-bottom: 1px solid #d9d9d9
}

.kui-list .searchtag {
    top: 6px
}

.kui-contextmenu {
    background: #fff;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .12), 0 1px 2px 0 rgba(0, 0, 0, .24);
    position: absolute;
    display: none;
    z-index: 9999
}

.kui-contextmenu li {
    position: relative
}

.kui-menu-item {
    line-height: 22px;
    height: 30px;
    padding: 4px 0 0 26px;
    color: #666;
    cursor: pointer;
    width: 100%;
    display: inline-block;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.kui-menu-icon-item {
    padding: 4px 0 0 14px
}

.kui-menu-icon-item .iconfont {
    margin-right: 4px
}

.kui-menu-item .iconfont {
    line-height: 22px
}

.kui-menu-item-active {
    background: #00abfc;
    color: #fff
}

.kui-menu-item:hover {
    background: rgba(99, 158, 241, .2);
    color: #333
}

.kui-menu-item-icon:before {
    vertical-align: text-top;
    margin-right: 4px
}

.kui-contextmenu li .submenu {
    position: absolute;
    top: 10px;
    right: 4px;
    color: #00abfc;
    font-size: 12px
}

.defaulttag {
    visibility: hidden;
    position: absolute;
    left: 8px;
    top: 10px;
    font-size: 13px
}

.kui-menu-sp-item {
    border-top: 1px solid #f9f9f9;
    display: block;
    margin: 2px 8px
}

.kui-masked-relative {
    position: relative
}

.kui-mask {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1040;
    background: rgba(0, 0, 0, .5)
}

.kui-mask-content {
    position: absolute;
    top: 50%;
    border: 1px solid #c3c3d6;
    background: #fff;
    z-index: 1050;
    padding: 6px;
    font-family: Microsoft YaHei;
    max-width: 200px
}

.kui-mask-loading, .kui-mask-text {
    display: table-cell;
    vertical-align: middle;
    word-break: break-all
}

.kui-mask-loading:before {
    content: "\E6C7";
    font-family: iconfont;
    width: 16px;
    height: 16px;
    display: inline-block;
    margin-right: 10px;
    color: #09c;
    font-size: 16px;
    animation: loading .5s;
    -moz-animation: loading .5s;
    -webkit-animation: loading .5s;
    -o-animation: loading .5s;
    animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    line-height: 16px
}

@keyframes loading {
    0% {
        transform: rotate(0deg)
    }
    25% {
        transform: rotate(90deg)
    }
    50% {
        transform: rotate(180deg)
    }
    75% {
        transform: rotate(270deg)
    }
    to {
        transform: rotate(1turn)
    }
}

@-moz-keyframes loading {
    0% {
        -moz-transform: rotate(0deg)
    }
    25% {
        -moz-transform: rotate(90deg)
    }
    50% {
        -moz-transform: rotate(180deg)
    }
    75% {
        -moz-transform: rotate(270deg)
    }
    to {
        -moz-transform: rotate(1turn)
    }
}

@-webkit-keyframes myfirst {
    0% {
        -webkit-transform: rotate(0deg)
    }
    25% {
        -webkit-transform: rotate(90deg)
    }
    50% {
        -webkit-transform: rotate(180deg)
    }
    75% {
        -webkit-transform: rotate(270deg)
    }
    to {
        -webkit-transform: rotate(1turn)
    }
}

.kui-overlay {
    background: #fff;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .5);
    position: absolute;
    z-index: 5000;
    min-height: 200px;
    min-width: 300px;
    border: 1px solid rgba(0, 0, 0, .3)
}

.kui-dialog {
    z-index: 5001
}

.kui-alert {
    z-index: 5002
}

.kui-overlay .kui-overlay-header {
    padding: 0 60px 0 30px;
    height: 40px;
    border-bottom: 1px solid #eee;
    line-height: 40px;
    font-size: 14px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.kui-overlay .kui-overlay-body, .kui-overlay .kui-overlay-header {
    font-family: Helvetica Neue, Verdana, Tahoma, Lantinghei SC, Hiragino Sans GB, Microsoft YaHei, \\5FAE\8F6F\96C5\9ED1, sans-serif !important
}

.kui-overlay .kui-overlay-body {
    padding: 20px;
    font-size: 12px;
    color: #666;
    line-height: 24px;
    text-align: left;
    background: #fff
}

.kui-overlay .kui-overlay-footer {
    height: 40px;
    border-top: 1px solid #eee;
    line-height: 38px;
    text-align: right;
    padding: 0 15px;
    background: #fff
}

.kui-overlay .kui-overlay-footer button {
    margin-left: 15px
}

.kui-overlay .kui-remover {
    position: absolute;
    top: 14px;
    right: 20px;
    font-size: 20px;
    color: #aeaeae;
    cursor: pointer
}

.kui-alert-type {
    font-size: 30px !important;
    margin: 0 10px;
    vertical-align: middle;
    padding-right: 20px
}

.kui-alert-type.icon-success {
    color: #87d068
}

.kui-alert-type.icon-error {
    color: #f05634
}

.kui-alert-type.icon-info {
    color: #00c1de
}

.kui-alert-type.icon-warning {
    color: #fa0
}

.kui-alert-type.icon-question {
    color: #00c1de
}

.kui-alert-type, .msginfo {
    display: table-cell;
    word-break: break-all;
    font-size: 14px
}

.kui-overlay .msginfo .kui-msg {
    max-height: 250px;
    overflow-x: hidden;
    overflow-y: auto
}

.moretag {
    text-align: right;
    cursor: pointer;
    color: #00c1de;
    font-size: 12px
}

.moremsgcontainer {
    clear: both;
    max-height: 100px;
    min-height: 40px;
    overflow: auto;
    border: 1px solid #ccc;
    font-size: 12px
}

.moremsgcontainer textarea {
    width: 100%;
    min-height: 40px;
    max-height: 100px;
    border: none
}

.moremsgcontainer textarea:focus {
    outline: none
}

.kui-overlay-loading {
    line-height: 20px;
    margin-top: 20px
}

.kui-overlay-loading .kui-mask-loading {
    display: inline-block
}

.kui-notify-container {
    position: fixed;
    z-index: 999999
}

.kui-notify {
    padding: 10px 20px 30px;
    border-radius: 6px;
    box-shadow: 0 1px 8px hsla(0, 0%, 39%, .6);
    border: 1px solid #d9d9d9;
    background: #fff;
    line-height: 1.5;
    position: relative;
    margin-bottom: 10px;
    overflow: hidden;
    right: -200px;
    opacity: 0
}

.kui-notify .kui-notify-header {
    font-size: 14px;
    color: #666;
    margin-bottom: 6px
}

.kui-notify .kui-notify-body {
    font-size: 14px;
    color: #666;
    line-height: 24px
}

.kui-notify .kui-remover {
    position: absolute;
    right: 20px;
    top: 16px;
    color: #aeaeae;
    cursor: pointer;
    font-size: 20px
}

.kui-notify-type {
    font-size: 30px !important;
    margin: 0
}

.kui-notify-type:before {
    margin-right: 10px
}

.kui-notify-type.icon-success {
    color: #87d068
}

.kui-notify-type.icon-error {
    color: #f50
}

.kui-notify-type.icon-info {
    color: #2db7f5
}

.kui-notify-type.icon-warning {
    color: #fa0
}

.kui-pagingbar li.kui-pager {
    border: 1px solid #ddd
}

.kui-pagingbar li {
    display: inline-block;
    padding: 3px 6px;
    margin-left: 4px;
    color: #666;
    cursor: pointer;
    min-width: 24px;
    height: 24px;
    line-height: 16px;
    text-align: center
}

.kui-pagingbar li.focus, .kui-pagingbar li.kui-pager:hover {
    background-color: #11c2d8;
    color: #fff
}

.kui-pagingbar li.kui-pager-disabled, .kui-pagingbar li.kui-pager-disabled:hover {
    background-color: #f6f6f6;
    cursor: default;
    border: none;
    color: #ddd
}

.kui-pagingbar li.kui-paging-toolbar {
    padding: 0;
    border: none
}

.kui-pagingbar .kui-paging-count {
    padding: 0;
    text-align: center;
    width: 30px;
    margin: 0 4px 0 0
}

.kui-pagingbar .kui-paging-count, .kui-pagingbar a {
    line-height: 24px;
    height: 24px;
    border: 1px solid #ddd
}

.kui-pagingbar a {
    display: inline-block;
    padding: 0 4px
}

.kui-pagingbar a:hover {
    background-color: #11c2d8;
    color: #fff
}

.kui-grid {
    border: 1px solid transparent;
    overflow: hidden;
    width: 100%
}

.kui-grid table {
    width: 100%;
    border-spacing: 0
}

.kui-grid .kui-grid-header table > thead > tr > th {
    height: 40px;
    line-height: 30px;
    border-bottom: 1px solid #ececec;
    background: #eee;
    padding: 0 8px;
    cursor: pointer
}

.kui-grid .kui-grid-body table > thead > tr > th {
    padding: 0 8px
}

.kui-grid .kui-grid-header table > thead > tr > th:hover {
    background: rgba(248, 252, 253, .85)
}

.kui-grid .kui-grid-header table > thead > tr > th .iconfont {
    float: right;
    font-size: 12px;
    color: #ccc
}

.kui-grid .kui-grid-header table > thead > tr > th.sort-asc .iconfont:before {
    content: "\E6C6";
    color: #00c1de
}

.kui-grid .kui-grid-header table > thead > tr > th.sort-desc .iconfont:before {
    content: "\E6C5";
    color: #00c1de
}

.kui-grid .kui-grid-header table > thead > tr > th:first-child {
    border-left: none
}

.kui-empty-columns {
    padding: 20px;
    font-size: 14 p;
    text-align: center
}

.kui-empty-columns .icon-info {
    color: #09c;
    font-size: 20px
}

.kui-empty-columns label {
    font-size: 16px;
    margin-left: 10px
}

.kui-grid .kui-grid-body {
    overflow: auto
}

.kui-grid .kui-grid-body table > tbody > tr:nth-child(2n) {
    background: #fff
}

.kui-grid .kui-grid-body table > tbody > tr.active, .kui-grid .kui-grid-body table > tbody > tr:hover {
    background: rgba(248, 252, 253, .85)
}

.kui-grid .kui-grid-body table > tbody > tr > td {
    padding: 12px 8px;
    border-top: 0;
    border-bottom: 1px solid #ececec;
    vertical-align: middle;
    word-break: break-all
}

.kui-grid .pagingbar {
    height: 40px;
    text-align: right;
    padding: 6px
}

input.error {
    border: 1px dotted #e6594e
}

input.highlight {
    border: 1px dotted #7abd54
}

label.error, label.tip {
    line-height: 16px;
    font-size: 14px;
    text-align: left;
    color: red;
    position: absolute;
    top: -16px;
    background: #fff;
    display: block;
    border: 1px solid #00aafb;
    padding: 4px;
    z-index: 999;
    border-radius: 4px
}

label.error:before {
    content: "\E6B1";
    font-family: iconfont;
    margin-right: 4px
}

label.tip {
    color: #aaa
}

label.valid {
    width: 32px
}

.control-label {
    text-align: right;
    line-height: 30px
}

.control-label s {
    text-decoration: none;
    color: red;
    font-size: 14px
}

.columns-control em {
    font-style: normal;
    font-size: 12px;
    color: #999;
    line-height: 24px
}

body {
    font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif !important;
    font-size: 12px;
    color: #495060;
}

body .form-checkbox input:checked + .form-icon, body .form-radio input:checked + .form-icon {
    background-color: #00c1de;
    border: 1px solid #00c1de
}

body .form-checkbox .form-icon, body .form-radio .form-icon {
    border: 1px solid #00c1de
}

body .iconfont:hover {
    color: #00c1de
}

body .nz-overlay-container {
    z-index: 9999 !important
}

::-webkit-scrollbar {
    width: 5px;
    height: 8px
}

::-webkit-scrollbar-thumb {
    width: 10px;
    height: 10px;
    background: #c5c5c5;
    border-radius: 4px
}

::-webkit-scrollbar-thumb:hover {
    background: #828282
}

::-webkit-scrollbar-track {
    background-color: rgba(0, 0, 0, .05);
    border-radius: 4px
}

* {
    margin: 0;
    padding: 0;
    font-size: 12px;
    box-sizing: border-box
}

.page-preview .desktop {
    margin-left: 0;
    width: 100%;
    position: absolute
}

.page-preview .desktop .main {
    background: transparent
}

.page-preview .desktop .viewmode .backedit {
    display: none
}

.page-preview .desktop .main-page qbi-grid {
    height: 100%
}

.drag-container {
    height: 100%
}

.fixed-left-void .desktopleft {
    left: 70px;
    width: calc(100% - 70px);
}

.fixed-left .desktopleft {
    left: 200px;
    width: calc(100% - 200px);
}

.desktop {
    z-index: 2;
    position: fixed;
    top: 45px;
    width: auto;
    height: calc(100% - 50px);
    min-height: 450px;
    background-color: hsla(0, 0%, 100%, .9);
    overflow: hidden
}

.desktop .icon-close, .desktop .icon-open {
    cursor: pointer;
    transform: rotate(180deg);
    display: inline-block
}

.desktop .dashboard_install {
    display: none
}

.dashboardname {
    width: 300px;
    border: none;
    border-radius: 0;
    background: none;
    margin: 0 auto;
    transition: width .1s;
    transition-timing-function: ease-in;
    margin-right: 4px
}

.bread {
    height: 40px;
    width: 100%
}

.main {
    width: 100%;
    background: #ffffff;
    height: 100%
}

.main span.icon-arrow-d, .main span.icon-arrow-u {
    cursor: pointer
}

.no-cube .main-page {
    width: calc(100% - 322px)
}

.no-widget .main-page {
    width: calc(100% - 222px)
}

.no-cube .main-page.viewmode, .no-widget .main-page.viewmode {
    width: 100%
}

.no-cube.no-widget .main-page {
    width: calc(100% - 22px)
}

.no-cube.no-widget .main-page.viewmode {
    width: 100%
}

.unfold-container {
    width: 20px !important;
    display: none;
    height: 100%;
    float: right;
    border-left: 1px solid #ddd;
    text-align: center
}

.unfold-container .unfole-cube {
    height: 50%
}

.unfold-container .unfold-widget {
    height: 50%;
    border-top: 1px solid #c8c8c8
}

.no-cube .unfold-container {
    display: block
}

.no-cube .main-cube {
    display: none
}

.no-widget .unfold-container {
    display: block
}

.no-widget .main-widget {
    display: none
}

.main-cube {
    width: 200px;
    height: 100%;
    float: right;
    border-right: 1px solid #ddd
}

.main-cube .cube {
    height: 30px;
    width: 100%
}

.main-cube .cube .kui-suggest {
    z-index: 1
}

.main-cube .cube .kui-suggest .kui-select-input {
    background: #f8f8f8;
    text-indent: 6px
}

.main-cube .cube .searchtag {
    top: 0
}

.main-cube .cube .kui-suggest:hover {
    box-shadow: none
}

.main-cube .cube-content {
    height: calc(100% - 50px)
}

.main-cube .cube-bread {
    position: relative;
    padding: 4px 10px;
    background-color: #e3e4e4;
    height: 25px
}

.main-cube .cube-bread .bread-title {
    font-size: 12px
}

.main-cube .cube-bread .iconfont {
    position: absolute;
    right: 5px
}

.main-cube .cube-change {
    background-color: #fff
}

.main-widget {
    width: 300px;
    height: 100%;
    float: right; /*border-right:1px solid #ddd;background:#fff*/
}

.main-widget .widget-bread {
    background-color: #e3e4e4;
    position: relative;
    height: 26px;
    padding: 4px 10px
}

.main-widget .widget-bread .iconfont {
    position: absolute;
    right: 5px
}

.main-widget .widget-container {
    height: calc(100% - 20px);
    overflow: hidden
}

.main-widget widget-container-layout {
    width: 100%;
    height: 100%;
    display: block
}

.main-page {
    width: calc(100% - 503px);
    float: right;
    overflow: auto;
    height: 100%;
    border-right: 1px solid #ddd;
    margin-right: 1px;
}

.main-page .icon-help.pull-right {
    position: fixed;
    left: 380px;
    top: 5px
}

.main-page .page-title {
    background: #fff;
    width: 100%;
    height: 35px
}

.main-page .page-title .page-name {
    width: calc(100% - 315px);
    display: inline-block;
    height: 40px;
    padding-top: 1px;
    text-align: center
}

.main-page .page-title .page-btns {
    width: 280px;
    margin-left: 10px;
    display: inline-block
}

.main-page .page-title .page-btns ul {
    text-align: left
}

.main-page .page-title .page-btns ul li {
    display: inline-block;
    margin-right: 8px;
    cursor: pointer
}

.main-page gridster {
    height: calc(100% - 10px);
    overflow-y: auto;
    overflow-x: hidden;
    padding-bottom: 10px
}

.main-page .handsontable .ht_master td {
    background-color: transparent
}

.main-page .handsontable td[rowspan] {
    vertical-align: middle
}

.main-page .handsontable .htDimmed {
    background: transparent
}

li.sortable-placeholder {
    border: 1px dashed #ccc;
    background: none;
    list-style: none;
    border: 1px solid #ccc;
    background: #f6f6f6;
    color: #1c94c4;
    margin: 5px;
    padding: 5px;
    height: 22px
}

.viewmode.main-page {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    z-index: 9999
}

.viewmode.main-page .page-btns {
    display: none
}

.viewmode.main-page .dashboard_install {
    display: block;
    width: 100%;
    text-align: center;
    line-height: 35px;
    height: 35px;
    font-size: 12px
}

.viewmode.main-page .dashboard_install span {
    display: inline-block;
    color: #4a4a4a;
    font-size: 14px
}

.viewmode.main-page .dashboard_install button {
    display: inline-block;
    float: right;
    margin: 6px 5px 0 0;
    background: #00c1de;
    border: 1px solid transparent;
    box-shadow: 0 0 0 0 #fff;
    border-radius: 4px;
    width: 70px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    cursor: pointer;
    pointer-events: auto;
    padding-right: 5px
}

.viewmode.main-page .dashboard_install button i {
    font-style: normal;
    display: inline-block;
    margin-left: -22px
}

.viewmode.main-page .dashboard_install button a {
    text-decoration: none;
    display: inline-block;
    width: 100%;
    height: 21px;
    color: #fff;
    background: url() no-repeat 100%;
    background-size: 18px 18px
}

.viewmode.main-page .page-name {
    display: none
}

.viewmode.main-page .grid-item {
    border: none;
    box-shadow: none
}

.viewmode.main-page .backedit {
    position: absolute;
    top: 0;
    right: 20px;
    font-size: 30px;
    cursor: pointer;
    z-index: 9999;
    color: #e62b06
}

.viewmode.main-page .backedit:hover {
    color: #7fd1e6
}

.viewmode.main-page .normalbox.text .qbi-component-title {
    display: none
}

.viewmode.main-page .normalbox.text .switchtainer {
    height: 100% !important
}

.viewmode.main-page .normalbox {
    cursor: auto
}

.tipsContainer {
    font-size: 14px;
    font-weight: 400;
    height: 120px;
    margin-top: 20px
}

.saverow {
    margin: 10px 0
}

.saverow input, .saverow select {
    width: 300px
}

.saverow select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
    padding: 2px 20px 2px 4px;
    border: 1px solid #dadada;
    min-width: 80px;
    background: url() 100% no-repeat
}

.mobile-icon {
    display: inline-block;
    vertical-align: bottom;
    width: 20px;
    height: 18px;
    cursor: pointer;
    background: url() no-repeat 0 0;
    background-size: contain
}

.edit-mail {
    background: url() no-repeat 0 3px;
    background-size: contain
}

.edit-mail, .new-mail {
    display: inline-block;
    width: 15px;
    height: 17px;
    cursor: pointer
}

.new-mail {
    background: url() no-repeat 0 3px;
    background-size: contain
}

.global-config {
    margin: 10px 0
}

.global-config .form-checkbox {
    display: initial
}

.err-tip {
    padding-left: 36px
}

#J_SaveContainer .ng-valid, .ng-valid[required] {
    border-left: 5px solid #42a948
}

#J_SaveContainer .ng-invalid:not(form), .ng-invalid:not(form) {
    border: 1px solid rgba(255, 23, 23, .3);
    border-left: 1px solid rgba(255, 23, 23, .3);
    box-shadow: none
}

.tooltip {
    position: absolute;
    z-index: 1070;
    display: block;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    word-break: normal;
    word-spacing: normal;
    word-wrap: normal;
    white-space: normal;
    opacity: 1
}

.fade {
    opacity: 0;
    transition: opacity .15s linear
}

.tooltip.top .tooltip-arrow {
    bottom: -5px
}

.tooltip.bottom .tooltip-arrow, .tooltip.top .tooltip-arrow {
    left: 50%;
    margin-left: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000
}

.tooltip.bottom .tooltip-arrow {
    top: -5px;
    transform: rotate(180deg)
}

.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid
}

.tooltip-inner {
    max-width: 200px;
    padding: 3px 8px;
    color: #fff;
    text-align: center;
    background-color: #000;
    border-radius: 4px
}

tooltip-content {
    float: left
}

.icon-help {
    margin: 10px 10px 0 0;
    cursor: pointer;
    top: 6px;
    left: 400px
}

.icon-help, .tooltip-reset {
    color: #00c1de;
    position: absolute
}

.tooltip-reset {
    box-sizing: content-box;
    visibility: hidden;
    z-index: 10000000;
    background-color: transparent;
    transition: all .5s ease-out
}

body ng2-menu-item .ng2-menu-item {
    height: 30px !important;
    line-height: 30px !important
}

body .mini-select .ng2-dropdown-button {
    width: 80px !important;
    min-width: 80px !important;
    padding: 0 !important
}

body #kui-guid23 .kui-overlay-header {
    color: #333;
    font-size: 14px;
    font-family: MicrosoftYaHei
}

.main .sidenav-container {
    height: 100%
}

.mobile-preview .grid-item.query, .mobile .grid-item.query {
    height: 50px !important
}

.mobile-preview .grid-item.query .gridster-item-inner, .mobile .grid-item.query .gridster-item-inner {
    height: auto;
    margin-bottom: 0
}

.mobile-preview .grid-item.query .qbi-component-title, .mobile-preview .main-page .page-title, .mobile .grid-item.query .qbi-component-title, .mobile .main-page .page-title {
    display: none
}

.mobile-preview .widget-container, .mobile .widget-container {
    height: 100%
}

.a-edit-cube {
    position: absolute;
    top: 26px;
    right: 20px;
    z-index: 99999;
    color: #17b4d6 !important;
    background: #fff
}

.filter-list {

}

.filter-list > ul > li {
    float: left;
    line-height: 18px;
    list-style-type: none;
    height: 20px;
    display: inline;
    margin: 4px 5px 0 0;
    padding: 0 6px;
    min-width: 70px;
    max-width: 98%;
    text-align: center;
    white-space: nowrap;
    border-radius: 12px;
}

.sicon {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: icomoon;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
}

.filter-list > ul > li.sicon {
    float: right;
    height: 18px;
    line-height: 20px;
    top: 0;
    cursor: pointer;
    color: #75827b;
}

.d_dimension {
    background: #E5F1FF;
    border: 1px solid #69C;
    color: #2A6085;
    display: inline !important;
    margin-left: 10px;
}

.d_dimension a {
    display: inline-block;
    color: #333;
    text-decoration: none;
    margin-right: 3px;
    max-width: 240px;
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: left;
}

.content-page {
    margin-left: 200px;
    overflow: hidden;
}

.content-page > .content {
    margin-bottom: 60px;
    margin-top: 35px;
    padding: 20px 5px 15px 5px;
}

#query_name_input {
    border: none;
    color: #0b0b0b !important;
}

#query_name_input:focus {
    border: 1px solid #00AA88;
    color: #0b0b0b !important;
}

.select_chart_div {
    border-color: #00c1de !important;
    box-shadow: 0 3px 10px #99ecf9 !important;
}

.query-input {
    height: 20px;
    line-height: 20px;
    width: 150px;
    border-width: 0px;
    padding: 0 3px;
    background: #def1f6;
}

.query-input:focus {
    border: 1px solid #dd4b39;
}

/*** 将页面自定义的样式移过来 ***/
.item-title {
    color: #000;
    font-size: 24px;
    display: block;
    height: 45px;
    font-weight: 400;
    padding-right: 30px;
    margin-left: 20px;
    margin-bottom: 3px;
}

.pull-left{
    float: left !important;
}
.text-right{
    float: right !important;
}
.m-t-30 {
    margin-top: 15px !important;
    margin-right: 20px !important;
}

#sidebar-menu > ul > li > a > span{
    font-size: 14px;
}

.content-page {
    margin-left: 0px;
}
.content-page .content {
    margin-top: 0px;
    padding-top: 0px;
}
.content-page .content .desktop{
    top: 0px;
    width: calc(100% - 10px);
    height: 100%;
    /*position: inherit;*/
}
.box-item .widget-chart-container {
    padding: 0px;
}
.table > thead > tr > th {
    border-bottom: 0px;
    font-size: 12px;
    font-weight: bold;
}
.table > tbody > tr > td {
    border-top: 1px solid #ddd;
}
